5 Commits

14 changed files with 1944 additions and 507 deletions

View File

@@ -23,6 +23,32 @@ CREATE TABLE IF NOT EXISTS templates (
UNIQUE(company, product_type) UNIQUE(company, product_type)
); );
-- AI Prompts table for storing validation prompts
CREATE TABLE IF NOT EXISTS ai_prompts (
id SERIAL PRIMARY KEY,
prompt_text TEXT NOT NULL,
prompt_type TEXT NOT NULL CHECK (prompt_type IN ('general', 'company_specific', 'system')),
company TEXT,
created_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
updated_at TIMESTAMP WITH TIME ZONE DEFAULT CURRENT_TIMESTAMP,
CONSTRAINT unique_company_prompt UNIQUE (company),
CONSTRAINT company_required_for_specific CHECK (
(prompt_type = 'general' AND company IS NULL) OR
(prompt_type = 'system' AND company IS NULL) OR
(prompt_type = 'company_specific' AND company IS NOT NULL)
)
);
-- Create a unique partial index to ensure only one general prompt
CREATE UNIQUE INDEX IF NOT EXISTS idx_unique_general_prompt
ON ai_prompts (prompt_type)
WHERE prompt_type = 'general';
-- Create a unique partial index to ensure only one system prompt
CREATE UNIQUE INDEX IF NOT EXISTS idx_unique_system_prompt
ON ai_prompts (prompt_type)
WHERE prompt_type = 'system';
-- AI Validation Performance Tracking -- AI Validation Performance Tracking
CREATE TABLE IF NOT EXISTS ai_validation_performance ( CREATE TABLE IF NOT EXISTS ai_validation_performance (
id SERIAL PRIMARY KEY, id SERIAL PRIMARY KEY,
@@ -51,3 +77,9 @@ CREATE TRIGGER update_templates_updated_at
BEFORE UPDATE ON templates BEFORE UPDATE ON templates
FOR EACH ROW FOR EACH ROW
EXECUTE FUNCTION update_updated_at_column(); EXECUTE FUNCTION update_updated_at_column();
-- Trigger to automatically update the updated_at column for ai_prompts
CREATE TRIGGER update_ai_prompts_updated_at
BEFORE UPDATE ON ai_prompts
FOR EACH ROW
EXECUTE FUNCTION update_updated_at_column();

View File

@@ -1,226 +0,0 @@
I will provide a JSON array with product data. Process the array by combining all products from validData and invalidData arrays into a single array, excluding any fields starting with “__”, such as “__index” or “__errors”. Process each product according to the reference guidelines below. If a field is not included in the data, do not include it in your response (e.g. do not include its key or any value) unless the specific field guidelines below say otherwise. If a product appears to be from an empty or entirely invalid line, do not include it in your response.
Your response should be a JSON object with the following structure:
{
"correctedData": [], // Array of corrected products
"changes": [], // Array of strings describing each change made
"warnings": [] // Array of strings with warnings or suggestions for manual review (see below for details)
}
IMPORTANT: For all fields that use IDs (categories, supplier, company, line, subline, ship_restrictions, tax_cat, artist, themes, etc.), you MUST return the ID values, not the display names. The system will handle converting IDs to display names.
Using the provided guidelines, focus on:
1. Correcting typos and any incorrect spelling or grammar
2. Standardizing product names
3. Correcting and enhancing descriptions by adding details, keywords, and SEO-friendly language
4. Fixing any obvious errors or inconsistencies between similar products in measurements, prices, or quantities
5. Adding correct categories, themes, and colors
Use only the provided data and your own knowledge to make changes. Do not make assumptions or make up information that you're not sure about. If you're unable to make a change you're confident about, leave the field as is. All data passed in should be validated, corrected, and returned. All values returned should be strings, not numbers. Do not leave out any fields that were present in the original data.
Possible reasons for including a warning in the warnings array:
- If you're unable to make a change you're confident about but you believe one needs to be made
- If there are inconsistencies in the data that could be valid but need to be reviewed
- If not enough information is provided to make a change that you believe is needed
- If you infer a value for a required field based on context
----------PRODUCT FIELD GUIDELINES----------
Fields: supplier, private_notes, company, line, subline, artist
Changes: Not allowed
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, return these fields exactly as provided with no changes
Fields: upc, supplier_no, notions_no, item_number
Changes: Formatting only
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, trim outside white space and return these fields exactly as provided with no other changes
Fields: hts_code
Changes: Minimal, you can correct formatting, obvious errors or inconsistencies
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, trim white space and any non-numeric characters, then return as a string. Do not validate in any other way.
Fields: image_url
Changes: Formatting only
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, convert all comma-separated values to valid https:// URLs and return
Fields: msrp, cost_each
Changes: Minimal, you can correct formatting, obvious errors or inconsistencies
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, strip any currency symbols and return as a string with exactly two decimal places, even if the last place is a 0.
Fields: qty_per_unit, case_qty
Changes: Minimal, you can correct formatting, obvious errors or inconsistencies
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, strip non-numeric characters and return
Fields: ship_restrictions
Changes: Only add a value if it's not already present
Required: You must always return a value for this field, even if it's not provided in the original data. If no value is provided, return 0.
Instructions: Always return a value exactly as provided, or return 0 if no value is provided.
Fields: eta
Changes: Minimal, you can correct formatting, obvious errors or inconsistencies
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, return a full month name, day is optional, no year ever (e.g. “January” or “March 3”). This value is not required if not provided.
Fields: name
Changes: Allowed to conform to guidelines, to fix typos or formatting
Required: You must always return a value for this field, even if it's not provided in the original data. If no value is provided, return the most reasonable value possible based on the naming guidelines and the other information you have.
Instructions: Always return a value that is corrected and enhanced per additional guidelines below
Fields: description
Changes: Full creative control allowed within guidelines
Required: You must always return a value for this field, even if it's not provided in the original data. If no value is provided, return the most accurate description possible based on the description guidelines and the other information you have.
Instructions: Always return a value that is corrected and enhanced per additional guidelines below
Fields: weight, length, width, height
Changes: Allowed to correct obvious errors or inconsistencies or to add missing values
Required: You must always return a value for this field, even if it's not provided in the original data. If no value is provided, return your best guess based on the other information you have or the dimensions for similar products.
Instructions: Always return a reasonable value (weights in ounces and dimensions in inches) that is validated against similar provided products and your knowledge of general object measurements (e.g. a sheet of paper is not going to be 3 inches thick, a pack of stickers is not going to be 250 ounces, this sheet of paper is very likely going to be the same size as that other sheet of paper from the same line). If a value is unusual or unreasonable, even wildly so, change it to match similar products or to be more reasonable. When correcting unreasonable weights or dimensions, prioritize comparisons to products from the same company and product line first, then broader category matches or common knowledge if necessary.Do not return 0 or null for any of these fields.
Fields: coo
Changes: Formatting only
Required: Return if present in the original data. Do not return if not present.
Instructions: If present, convert all country names and abbreviations to the official ISO 3166-1 alpha-2 two-character country code. Convert any value with more than two characters to two characters only (e.g. "United States" or "USA" should both return "US").
Fields: tax_cat
Changes: Allowed to correct obvious errors or inconsistencies or to add missing values
Required: You must always return a value for this field, even if it's not provided in the original data. If no value is provided, return 0.
Instructions: Always return a valid numerical tax code ID from the Available Tax Codes array below. Give preference to the value provided, but correct it if another value is more accurate. You must return a value for this field. 0 should be the default value in most cases.
Fields: size_cat
Changes: Allowed to correct obvious errors or inconsistencies or to add missing values
Required: Return if present in the original data or if not present and applicable. Do not return if not applicable (e.g. if no size categories apply based on what you know about the product).
Instructions: If present or if applicable, return one valid numerical size category ID from the Available Size Categories array below. Give preference to the value provided, but correct it if another value is more accurate. If the product name contains a match for one of the size categories (such as 12x12, 6x6, 2oz, etc) you MUST return that size category with the results. A value is not required if none of the size categories apply.
Fields: themes
Changes: Allowed to correct obvious errors or inconsistencies or to add missing values
Required: Return if present in the original data or if not present and applicable. Do not return any value if not applicable (e.g. if no themes apply based on what you know about the product).
Instructions: If present, confirm that each provided theme matches what you understand to be a theme of the product. Remove any themes that do not match and add any themes that are missing. Most products will have zero or one theme. Return a comma-separated list of numerical theme IDs from the Available Themes array below. If you choose a sub-theme, you do not need to include its parent theme in the list.
Fields: colors
Changes: Allowed to correct obvious errors or inconsistencies or to add missing values
Required: Return if present in the original data or if not present and applicable. Do not return any value if not applicable (e.g. if no colors apply based on what you know about the product).
Instructions: If present or if applicable, return a comma-separated list of numerical color IDs from the Available Colors array below, using the product name as the primary guide (e.g. if the name contains Blue or a blue variant, you should return the blue color ID). A value is not required if none of the colors apply. Most products will have zero colors.
Fields: categories
Changes: Allowed to correct obvious errors or inconsistencies or to add missing values
Required: You must always return at least one value for this field, even if it's not provided in the original data. If no value is provided, return the most appropriate category or categories based on the other information you have.
Instructions: Always return a comma-separated list of one or more valid numerical category IDs from the Available Categories array below. Give preference to the values provided, particularly if the other information isn't enough to determine a category, but correct them or add new categories if another value is more accurate. Do not return categories in the Deals or Black Friday categories, and strip these from the list if present. If you choose a subcategory at any level, you do not need to include its parent categories in the list. You must return at least one category and you can return multiple categories if applicable. All categories have equal value so their order is not important. Always try to return the most specific categories possible (e.g. one in the third level of the category hierarchy is better than one in the second level).
----------PRODUCT NAMING GUIDELINES----------
If there's only one of this type of product in a line: [Line Name] [Product Name] - [Company]
Example: "Cosmos Infinity Chipboard - Stamperia"
Example: "Serene Petals 6x6 Paper Pad - Prima"
Multiple similar products in a line: [Differentiator] [Product Type] - [Line Name] - [Company]
Example: "Ice & Shells Stencil - Arctic Antarctic - Stamperia"
Example: "Astronomy Paper - Cosmos Infinity - Stamperia"
Standalone products: [Product Name] - [Company]
Example: "Hedwig Puffy Stickers - Paper House Productions"
Example: "Heart Tree Dies - Lawn Fawn"
Color-based products: [Color] [Product Name] - [Company]
Example: "Green Valley Enamel Dots - Altenew"
Example: "Magenta Aqua Pigment - Brutus Monroe"
Complex products: [Differentiator] [Line] [Product Type] - [Company]
Example: "Size 6 Round Black Velvet Watercolor Brush - Silver Brush Limited" (Size 6 Round is the differentiator, Black Velvet is the line, Watercolor Brush is the product type)
These should not be included in the name, unless there are multiple products that are otherwise identical:
- Product size
- Product weight
- Number of pages
- How many are in the package
Naming Conventions:
- Paper sizes: Use "12x12", "8x8", "6x6" (no spaces or units of measure)
- Company names must match backend exactly
- Always capitalize every word in the name, including short articles like "The" and "An"
- Use "Idea-ology" (not "idea-ology" or "Ideaology")
- All stamps are "Stamp Set" (not "Clear Stamps" or "Rubber Stamps")
- All dies are "Dies" or "Die" (not "Die Set")
- Brands with their own naming conventions should be respected, such as "Doodle Cuts" for dies from Doodlebug
Special Brand Rules - Ranger:
Format: [Product Name] - [Designer Line] - Ranger
Possible Designers: Dylusions, Dina Wakley MEdia, Simon Hurley create., Wendy Vecchi
Example: "Stacked Stencil - Dina Wakley MEdia - Ranger"
Special Brand Rules - Tim Holtz products from Ranger:
Format: [Color] [Product Name/Type] - Tim Holtz Distress - Ranger
Example: "Mermaid Lagoon Tim Holtz Distress Oxide Ink Pad - Ranger"
Special Brand Rules - Tim Holtz products from Sizzix or Stampers Anonymous:
Format: [Product Name] [Product Type] by Tim Holtz - [Company]
Example: "Leaf Fragments Thinlits Dies by Tim Holtz - Sizzix"
Special Brand Rules - Tim Holtz products from Advantus/Idea-ology:
Format: [Product Name] - Tim Holtz Idea-ology
Example: "Tiny Vials - Tim Holtz Idea-ology"
Special Brand Rules - Dies from Sizzix:
Include die type plus "Dies" or "Die"
Examples:
"Art Nouveau 3-D Textured Impressions Embossing Folder - Sizzix"
"Pocket Pals Thinlits Dies - Sizzix"
"Butterfly Wishes Framelits Dies & Stamps - Sizzix"
Important Notes
- Ensure that product names are consistent across all products of the same type
- Use the minimum amount of information needed to uniquely identify the product
- Put detailed specifications in the product description, not its name
Edge Cases
- If the product is missing a company name, infer one from the other products included in the data
- If the product is missing a clear differentiator and needs one to be unique, infer and add one from the other data provided (e.g. the description, existing size categories, etc.)
Incorrect example: MVP Rugby - Collection Pack - Photoplay
Notes: there should be no dash between the line and the product
Incorrect Example: A2 Easel Cards - Black - Photoplay
Notes: the differentiating factor should come first: “Black A2 Easel Cards - Photoplay”. Size is ok to include here because this is the name printed on the package.
Incorrect Example: 6” - Scriber Needle Modeling Tool
Notes: this product only comes in one size, so 6” isnt needed. The company name should also be included.
Incorrect Example: Slick - White - Tulip Dimensional Fabric Paint 4oz
Notes: color should be first, then type, then product, then company, so “White Slick Dimensional Fabric Paint - Tulip”. It appears theres only one size available so no need to differentiate in the name.
Incorrect Example: Silhouette Adhesive Cork Sheets 5”X7” 8/Pkg
Notes: should be “Adhesive Cork Sheets - Silhouette”
Incorrect Example: Galaxy - Opaque - American Crafts Color Pour Resin Dyes
Notes: “Galaxy Opaque Dye Set - Color Pour Resin - American Crafts”
Incorrect Example: Slate - Lion Brand Truboo Yarn
Notes: [Differentiator] [Line] [Product Type] - [Company] : “Slate Truboo Yarn - Lion Brand”
Incorrect Example: Rose Quartz Dylusions Shimmer Paint
Notes: “Rose Quartz Shimmer Paint - Dylusions - Ranger”
----------PRODUCT DESCRIPTION GUIDELINES----------
Product descriptions are an extremely important part of the listing and are the most important part of your response. Care should be taken to ensure they are correct, helpful, and SEO-friendly.
If a description is provided in the data, use it as a starting point. Correct any spelling errors, typos, poor grammar, or awkward phrasing. If necessary and you have the information, add more details, describe how the customer could use it, etc. Use complete sentences and keep SEO in mind.
If no description is provided, make one up using the product name, the information you have, and the other provided guidelines. At minimum, a description should be one complete sentence that starts with a capital letter and ends with a period. Unless the product is extremely complex, 2-4 sentences is usually sufficient if you have enough information.
Important Notes:
- Every description should state exactly what's included in the product (e.g. "Includes one 12x12 sheet of patterned cardstock." or "Includes one 6x12 sheet with 27 unique stickers." or "Includes 55 pieces." or "Package includes machine, power cord, 12 sheets of cardstock, 3 dies, and project instructions.")
- Do not use the word "our" in the description (this usually shows up when we copy a description from the manufacturer). Instead use "these" or "[Company name] [product]" or similar. (e.g. don't use "Our journals are hand-made in the USA", instead use "These journals are hand made..." or "Archer & Olive journals are handmade...")
- Don't include statements that add no value like “this is perfect for all your paper crafts”. If the product helps to solve a unique problem or has a unique feature, by all means describe it, but if its just a normal sheet of paper or pack of stickers, you dont have to pretend like its the best thing ever. At the same time, ensure that you add enough copy to ensure good SEO.
- State as many facts as you can about the product, considering the viewpoint of the customer and what they would want to know when looking at it. They probably want to know dimensions, what products its compatible with, how thick the paper is, how many sheets are included, whether the sheets are double-sided or not, which items are in the kit, etc. Say as much as you possibly can with the information that you have.
- !!DO NOT make up information if you aren't sure about it. A minimal correct description is better than a long incorrect one!!
Avoid/remove:
- The word "Imported"
- Any warnings about Prop 65, choking hazards, etc
- The manufacturer's name if it's included as the very first thing in the description
- Any statement similar to "comes in a variety of colors, each sold separately"

View File

@@ -0,0 +1,335 @@
const express = require('express');
const router = express.Router();
// Get all AI prompts
router.get('/', async (req, res) => {
try {
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
const result = await pool.query(`
SELECT * FROM ai_prompts
ORDER BY prompt_type ASC, company ASC
`);
res.json(result.rows);
} catch (error) {
console.error('Error fetching AI prompts:', error);
res.status(500).json({
error: 'Failed to fetch AI prompts',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Get prompt by ID
router.get('/:id', async (req, res) => {
try {
const { id } = req.params;
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
const result = await pool.query(`
SELECT * FROM ai_prompts
WHERE id = $1
`, [id]);
if (result.rows.length === 0) {
return res.status(404).json({ error: 'AI prompt not found' });
}
res.json(result.rows[0]);
} catch (error) {
console.error('Error fetching AI prompt:', error);
res.status(500).json({
error: 'Failed to fetch AI prompt',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Get prompt by company
router.get('/company/:companyId', async (req, res) => {
try {
const { companyId } = req.params;
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
const result = await pool.query(`
SELECT * FROM ai_prompts
WHERE company = $1
`, [companyId]);
if (result.rows.length === 0) {
return res.status(404).json({ error: 'AI prompt not found for this company' });
}
res.json(result.rows[0]);
} catch (error) {
console.error('Error fetching AI prompt by company:', error);
res.status(500).json({
error: 'Failed to fetch AI prompt by company',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Get general prompt
router.get('/type/general', async (req, res) => {
try {
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
const result = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'general'
`);
if (result.rows.length === 0) {
return res.status(404).json({ error: 'General AI prompt not found' });
}
res.json(result.rows[0]);
} catch (error) {
console.error('Error fetching general AI prompt:', error);
res.status(500).json({
error: 'Failed to fetch general AI prompt',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Get system prompt
router.get('/type/system', async (req, res) => {
try {
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
const result = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'system'
`);
if (result.rows.length === 0) {
return res.status(404).json({ error: 'System AI prompt not found' });
}
res.json(result.rows[0]);
} catch (error) {
console.error('Error fetching system AI prompt:', error);
res.status(500).json({
error: 'Failed to fetch system AI prompt',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Create new AI prompt
router.post('/', async (req, res) => {
try {
const {
prompt_text,
prompt_type,
company
} = req.body;
// Validate required fields
if (!prompt_text || !prompt_type) {
return res.status(400).json({ error: 'Prompt text and type are required' });
}
// Validate prompt type
if (!['general', 'company_specific', 'system'].includes(prompt_type)) {
return res.status(400).json({ error: 'Prompt type must be either "general", "company_specific", or "system"' });
}
// Validate company is provided for company-specific prompts
if (prompt_type === 'company_specific' && !company) {
return res.status(400).json({ error: 'Company is required for company-specific prompts' });
}
// Validate company is not provided for general or system prompts
if ((prompt_type === 'general' || prompt_type === 'system') && company) {
return res.status(400).json({ error: 'Company should not be provided for general or system prompts' });
}
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
const result = await pool.query(`
INSERT INTO ai_prompts (
prompt_text,
prompt_type,
company
) VALUES ($1, $2, $3)
RETURNING *
`, [
prompt_text,
prompt_type,
company
]);
res.status(201).json(result.rows[0]);
} catch (error) {
console.error('Error creating AI prompt:', error);
// Check for unique constraint violations
if (error instanceof Error && error.message.includes('unique constraint')) {
if (error.message.includes('unique_company_prompt')) {
return res.status(409).json({
error: 'A prompt already exists for this company',
details: error.message
});
} else if (error.message.includes('idx_unique_general_prompt')) {
return res.status(409).json({
error: 'A general prompt already exists',
details: error.message
});
} else if (error.message.includes('idx_unique_system_prompt')) {
return res.status(409).json({
error: 'A system prompt already exists',
details: error.message
});
}
}
res.status(500).json({
error: 'Failed to create AI prompt',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Update AI prompt
router.put('/:id', async (req, res) => {
try {
const { id } = req.params;
const {
prompt_text,
prompt_type,
company
} = req.body;
// Validate required fields
if (!prompt_text || !prompt_type) {
return res.status(400).json({ error: 'Prompt text and type are required' });
}
// Validate prompt type
if (!['general', 'company_specific', 'system'].includes(prompt_type)) {
return res.status(400).json({ error: 'Prompt type must be either "general", "company_specific", or "system"' });
}
// Validate company is provided for company-specific prompts
if (prompt_type === 'company_specific' && !company) {
return res.status(400).json({ error: 'Company is required for company-specific prompts' });
}
// Validate company is not provided for general or system prompts
if ((prompt_type === 'general' || prompt_type === 'system') && company) {
return res.status(400).json({ error: 'Company should not be provided for general or system prompts' });
}
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
// Check if the prompt exists
const checkResult = await pool.query('SELECT * FROM ai_prompts WHERE id = $1', [id]);
if (checkResult.rows.length === 0) {
return res.status(404).json({ error: 'AI prompt not found' });
}
const result = await pool.query(`
UPDATE ai_prompts
SET
prompt_text = $1,
prompt_type = $2,
company = $3
WHERE id = $4
RETURNING *
`, [
prompt_text,
prompt_type,
company,
id
]);
res.json(result.rows[0]);
} catch (error) {
console.error('Error updating AI prompt:', error);
// Check for unique constraint violations
if (error instanceof Error && error.message.includes('unique constraint')) {
if (error.message.includes('unique_company_prompt')) {
return res.status(409).json({
error: 'A prompt already exists for this company',
details: error.message
});
} else if (error.message.includes('idx_unique_general_prompt')) {
return res.status(409).json({
error: 'A general prompt already exists',
details: error.message
});
} else if (error.message.includes('idx_unique_system_prompt')) {
return res.status(409).json({
error: 'A system prompt already exists',
details: error.message
});
}
}
res.status(500).json({
error: 'Failed to update AI prompt',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Delete AI prompt
router.delete('/:id', async (req, res) => {
try {
const { id } = req.params;
const pool = req.app.locals.pool;
if (!pool) {
throw new Error('Database pool not initialized');
}
const result = await pool.query('DELETE FROM ai_prompts WHERE id = $1 RETURNING *', [id]);
if (result.rows.length === 0) {
return res.status(404).json({ error: 'AI prompt not found' });
}
res.json({ message: 'AI prompt deleted successfully' });
} catch (error) {
console.error('Error deleting AI prompt:', error);
res.status(500).json({
error: 'Failed to delete AI prompt',
details: error instanceof Error ? error.message : 'Unknown error'
});
}
});
// Error handling middleware
router.use((err, req, res, next) => {
console.error('AI prompts route error:', err);
res.status(500).json({
error: 'Internal server error',
details: err.message
});
});
module.exports = router;

View File

@@ -289,8 +289,108 @@ async function generateDebugResponse(productsToUse, res) {
}); });
try { try {
const prompt = await loadPrompt(promptConnection, productsToUse); // Get the local PostgreSQL pool to fetch prompts
const fullPrompt = prompt + "\n" + JSON.stringify(productsToUse); const pool = res.app.locals.pool;
if (!pool) {
console.warn("⚠️ Local database pool not available for prompts");
throw new Error("Database connection not available");
}
// First, fetch the system prompt
const systemPromptResult = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'system'
`);
// Get system prompt or use default
let systemPrompt = null;
if (systemPromptResult.rows.length > 0) {
systemPrompt = systemPromptResult.rows[0];
console.log("📝 Loaded system prompt from database, ID:", systemPrompt.id);
} else {
console.warn("⚠️ No system prompt found in database, will use default");
}
// Then, fetch the general prompt
const generalPromptResult = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'general'
`);
if (generalPromptResult.rows.length === 0) {
console.warn("⚠️ No general prompt found in database");
throw new Error("No general prompt found in database");
}
// Get the general prompt text and info
const generalPrompt = generalPromptResult.rows[0];
console.log("📝 Loaded general prompt from database, ID:", generalPrompt.id);
// Fetch company-specific prompts if we have products to validate
let companyPrompts = [];
if (productsToUse && Array.isArray(productsToUse)) {
// Extract unique company IDs from products
const companyIds = new Set();
productsToUse.forEach(product => {
if (product.company) {
companyIds.add(String(product.company));
}
});
if (companyIds.size > 0) {
console.log(`🔍 Found ${companyIds.size} unique companies in products:`, Array.from(companyIds));
// Fetch company-specific prompts
const companyPromptsResult = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'company_specific'
AND company = ANY($1)
`, [Array.from(companyIds)]);
companyPrompts = companyPromptsResult.rows;
console.log(`📝 Loaded ${companyPrompts.length} company-specific prompts`);
}
}
// Find company names from taxonomy for the validation endpoint
const companyPromptsWithNames = companyPrompts.map(prompt => {
let companyName = "Unknown Company";
if (taxonomy.companies && Array.isArray(taxonomy.companies)) {
const companyData = taxonomy.companies.find(company =>
String(company[0]) === String(prompt.company)
);
if (companyData && companyData[1]) {
companyName = companyData[1];
}
}
return {
id: prompt.id,
company: prompt.company,
companyName: companyName,
prompt_text: prompt.prompt_text
};
});
// Now use loadPrompt to get the actual combined prompt
const promptData = await loadPrompt(promptConnection, productsToUse, res.app.locals.pool);
const fullUserPrompt = promptData.userContent + "\n" + JSON.stringify(productsToUse);
const promptLength = promptData.systemInstructions.length + fullUserPrompt.length; // Store prompt length for performance metrics
console.log("📝 Generated prompt length:", promptLength);
console.log("📝 System instructions length:", promptData.systemInstructions.length);
console.log("📝 User content length:", fullUserPrompt.length);
// Format the messages as they would be sent to the API
const apiMessages = [
{
role: "system",
content: promptData.systemInstructions
},
{
role: "user",
content: fullUserPrompt
}
];
// Create the response with taxonomy stats // Create the response with taxonomy stats
let categoriesCount = 0; let categoriesCount = 0;
@@ -330,9 +430,28 @@ async function generateDebugResponse(productsToUse, res) {
: null, : null,
} }
: null, : null,
basePrompt: prompt, basePrompt: systemPrompt ? systemPrompt.prompt_text + "\n\n" + generalPrompt.prompt_text : generalPrompt.prompt_text,
sampleFullPrompt: fullPrompt, sampleFullPrompt: fullUserPrompt,
promptLength: fullPrompt.length, promptLength: promptLength,
apiFormat: apiMessages,
promptSources: {
...(systemPrompt ? {
systemPrompt: {
id: systemPrompt.id,
prompt_text: systemPrompt.prompt_text
}
} : {
systemPrompt: {
id: 0,
prompt_text: `You are a specialized e-commerce product data processor for a crafting supplies website tasked with providing complete, correct, appealing, and SEO-friendly product listings. You should write professionally, but in a friendly and engaging tone. You have meticulous attention to detail and are a master at your craft.`
}
}),
generalPrompt: {
id: generalPrompt.id,
prompt_text: generalPrompt.prompt_text
},
companyPrompts: companyPromptsWithNames
}
}; };
console.log("Sending response with taxonomy stats:", response.taxonomyStats); console.log("Sending response with taxonomy stats:", response.taxonomyStats);
@@ -513,22 +632,101 @@ SELECT t.cat_id,t.name,null as master_cat_id,1 AS level_order FROM product_categ
} }
} }
// Load the prompt from file and inject taxonomy data // Load prompts from database and inject taxonomy data
async function loadPrompt(connection, productsToValidate = null) { async function loadPrompt(connection, productsToValidate = null, appPool = null) {
try { try {
const promptPath = path.join(
__dirname,
"..",
"prompts",
"product-validation.txt"
);
const basePrompt = await fs.readFile(promptPath, "utf8");
// Get taxonomy data using the provided MySQL connection // Get taxonomy data using the provided MySQL connection
const taxonomy = await getTaxonomyData(connection); const taxonomy = await getTaxonomyData(connection);
// Add system instructions to the prompt // Use the provided pool parameter instead of global.app
const systemInstructions = `You are a specialized e-commerce product data processor for a crafting supplies website tasked with providing complete, correct, appealing, and SEO-friendly product listings. You should write professionally, but in a friendly and engaging tone. You have meticulous attention to detail and are a master at your craft.`; const pool = appPool;
if (!pool) {
console.warn("⚠️ Local database pool not available for prompts");
throw new Error("Database connection not available");
}
// Fetch the system prompt
const systemPromptResult = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'system'
`);
// Default system instructions in case the system prompt is not found
let systemInstructions = `You are a specialized e-commerce product data processor for a crafting supplies website tasked with providing complete, correct, appealing, and SEO-friendly product listings. You should write professionally, but in a friendly and engaging tone. You have meticulous attention to detail and are a master at your craft.`;
// If system prompt exists in the database, use it
if (systemPromptResult.rows.length > 0) {
systemInstructions = systemPromptResult.rows[0].prompt_text;
console.log("📝 Loaded system prompt from database");
} else {
console.warn("⚠️ No system prompt found in database, using default");
}
// Fetch the general prompt
const generalPromptResult = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'general'
`);
if (generalPromptResult.rows.length === 0) {
console.warn("⚠️ No general prompt found in database");
throw new Error("No general prompt found in database");
}
// Get the general prompt text
const basePrompt = generalPromptResult.rows[0].prompt_text;
console.log("📝 Loaded general prompt from database");
// Fetch company-specific prompts if we have products to validate
let companyPrompts = [];
if (productsToValidate && Array.isArray(productsToValidate)) {
// Extract unique company IDs from products
const companyIds = new Set();
productsToValidate.forEach(product => {
if (product.company) {
companyIds.add(String(product.company));
}
});
if (companyIds.size > 0) {
console.log(`🔍 Found ${companyIds.size} unique companies in products:`, Array.from(companyIds));
// Fetch company-specific prompts
const companyPromptsResult = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'company_specific'
AND company = ANY($1)
`, [Array.from(companyIds)]);
companyPrompts = companyPromptsResult.rows;
console.log(`📝 Loaded ${companyPrompts.length} company-specific prompts`);
}
}
// Combine prompts - start with the general prompt
let combinedPrompt = basePrompt;
// Add any company-specific prompts with annotations
if (companyPrompts.length > 0) {
combinedPrompt += "\n\n--- COMPANY-SPECIFIC INSTRUCTIONS ---\n";
for (const prompt of companyPrompts) {
// Find company name from taxonomy
let companyName = "Unknown Company";
if (taxonomy.companies && Array.isArray(taxonomy.companies)) {
const companyData = taxonomy.companies.find(company =>
String(company[0]) === String(prompt.company)
);
if (companyData && companyData[1]) {
companyName = companyData[1];
}
}
combinedPrompt += `\n[SPECIFIC TO COMPANY: ${companyName} (ID: ${prompt.company})]:\n${prompt.prompt_text}\n`;
}
combinedPrompt += "\n--- END COMPANY-SPECIFIC INSTRUCTIONS ---\n";
}
// If we have products to validate, create a filtered prompt // If we have products to validate, create a filtered prompt
if (productsToValidate) { if (productsToValidate) {
@@ -655,11 +853,14 @@ ${JSON.stringify(mixedTaxonomy.sizeCategories)}${
----------Here is the product data to validate----------`; ----------Here is the product data to validate----------`;
// Return the filtered prompt // Return both system instructions and user content separately
return systemInstructions + basePrompt + "\n" + taxonomySection; return {
systemInstructions,
userContent: combinedPrompt + "\n" + taxonomySection
};
} }
// Generate the full unfiltered prompt // Generate the full unfiltered prompt for taxonomy section
const taxonomySection = ` const taxonomySection = `
Available Categories: Available Categories:
${JSON.stringify(taxonomy.categories)} ${JSON.stringify(taxonomy.categories)}
@@ -687,7 +888,11 @@ ${JSON.stringify(taxonomy.artists)}
Here is the product data to validate:`; Here is the product data to validate:`;
return systemInstructions + basePrompt + "\n" + taxonomySection; // Return both system instructions and user content separately
return {
systemInstructions,
userContent: combinedPrompt + "\n" + taxonomySection
};
} catch (error) { } catch (error) {
console.error("Error loading prompt:", error); console.error("Error loading prompt:", error);
throw error; // Re-throw to be handled by the calling function throw error; // Re-throw to be handled by the calling function
@@ -735,18 +940,24 @@ router.post("/validate", async (req, res) => {
// Load the prompt with the products data to filter taxonomy // Load the prompt with the products data to filter taxonomy
console.log("🔄 Loading prompt with filtered taxonomy..."); console.log("🔄 Loading prompt with filtered taxonomy...");
const prompt = await loadPrompt(connection, products); const promptData = await loadPrompt(connection, products, req.app.locals.pool);
const fullPrompt = prompt + "\n" + JSON.stringify(products); const fullUserPrompt = promptData.userContent + "\n" + JSON.stringify(products);
promptLength = fullPrompt.length; // Store prompt length for performance metrics const promptLength = promptData.systemInstructions.length + fullUserPrompt.length; // Store prompt length for performance metrics
console.log("📝 Generated prompt length:", promptLength); console.log("📝 Generated prompt length:", promptLength);
console.log("📝 System instructions length:", promptData.systemInstructions.length);
console.log("📝 User content length:", fullUserPrompt.length);
console.log("🤖 Sending request to OpenAI..."); console.log("🤖 Sending request to OpenAI...");
const completion = await openai.chat.completions.create({ const completion = await openai.chat.completions.create({
model: "o3-mini", model: "gpt-4o",
messages: [ messages: [
{
role: "system",
content: promptData.systemInstructions,
},
{ {
role: "user", role: "user",
content: fullPrompt, content: fullUserPrompt,
}, },
], ],
temperature: 0.2, temperature: 0.2,
@@ -884,7 +1095,94 @@ router.post("/validate", async (req, res) => {
console.error("⚠️ Failed to record performance metrics:", metricError); console.error("⚠️ Failed to record performance metrics:", metricError);
} }
// Include performance metrics in the response // Get sources of the prompts for tracking
let promptSources = null;
try {
// Get system prompt
const systemPromptResult = await pool.query(`
SELECT * FROM ai_prompts WHERE prompt_type = 'system'
`);
// Get general prompt
const generalPromptResult = await pool.query(`
SELECT * FROM ai_prompts WHERE prompt_type = 'general'
`);
// Extract unique company IDs from products
const companyIds = new Set();
products.forEach(product => {
if (product.company) {
companyIds.add(String(product.company));
}
});
let companyPrompts = [];
if (companyIds.size > 0) {
// Fetch company-specific prompts
const companyPromptsResult = await pool.query(`
SELECT * FROM ai_prompts
WHERE prompt_type = 'company_specific'
AND company = ANY($1)
`, [Array.from(companyIds)]);
companyPrompts = companyPromptsResult.rows;
}
// Find company names from taxonomy for the validation endpoint
const companyPromptsWithNames = companyPrompts.map(prompt => {
let companyName = "Unknown Company";
if (taxonomy.companies && Array.isArray(taxonomy.companies)) {
const companyData = taxonomy.companies.find(company =>
String(company[0]) === String(prompt.company)
);
if (companyData && companyData[1]) {
companyName = companyData[1];
}
}
return {
id: prompt.id,
company: prompt.company,
companyName: companyName,
prompt_text: prompt.prompt_text
};
});
// Set prompt sources
if (generalPromptResult.rows.length > 0) {
const generalPrompt = generalPromptResult.rows[0];
let systemPrompt = null;
if (systemPromptResult.rows.length > 0) {
systemPrompt = systemPromptResult.rows[0];
}
promptSources = {
...(systemPrompt ? {
systemPrompt: {
id: systemPrompt.id,
prompt_text: systemPrompt.prompt_text
}
} : {
systemPrompt: {
id: 0,
prompt_text: `You are a specialized e-commerce product data processor for a crafting supplies website tasked with providing complete, correct, appealing, and SEO-friendly product listings. You should write professionally, but in a friendly and engaging tone. You have meticulous attention to detail and are a master at your craft.`
}
}),
generalPrompt: {
id: generalPrompt.id,
prompt_text: generalPrompt.prompt_text
},
companyPrompts: companyPromptsWithNames
};
}
} catch (promptSourceError) {
console.error("⚠️ Error getting prompt sources:", promptSourceError);
// Don't fail the entire validation if just prompt sources retrieval fails
}
// Include prompt sources in the response
res.json({ res.json({
success: true, success: true,
changeDetails: changeDetails, changeDetails: changeDetails,
@@ -895,6 +1193,7 @@ router.post("/validate", async (req, res) => {
isEstimate: true, isEstimate: true,
productCount: products.length productCount: products.length
}, },
promptSources: promptSources,
...aiResponse, ...aiResponse,
}); });
} catch (parseError) { } catch (parseError) {

View File

@@ -18,6 +18,7 @@ const categoriesRouter = require('./routes/categories');
const importRouter = require('./routes/import'); const importRouter = require('./routes/import');
const aiValidationRouter = require('./routes/ai-validation'); const aiValidationRouter = require('./routes/ai-validation');
const templatesRouter = require('./routes/templates'); const templatesRouter = require('./routes/templates');
const aiPromptsRouter = require('./routes/ai-prompts');
// Get the absolute path to the .env file // Get the absolute path to the .env file
const envPath = '/var/www/html/inventory/.env'; const envPath = '/var/www/html/inventory/.env';
@@ -103,6 +104,7 @@ async function startServer() {
app.use('/api/import', importRouter); app.use('/api/import', importRouter);
app.use('/api/ai-validation', aiValidationRouter); app.use('/api/ai-validation', aiValidationRouter);
app.use('/api/templates', templatesRouter); app.use('/api/templates', templatesRouter);
app.use('/api/ai-prompts', aiPromptsRouter);
// Basic health check route // Basic health check route
app.get('/health', (req, res) => { app.get('/health', (req, res) => {

View File

@@ -1,9 +1,9 @@
const mysql = require('mysql2/promise'); const { Pool } = require('pg');
let pool; let pool;
function initPool(config) { function initPool(config) {
pool = mysql.createPool(config); pool = new Pool(config);
return pool; return pool;
} }

View File

@@ -1,108 +1,61 @@
import React, { useState } from 'react'; import React, { useState } from 'react';
import { AiValidationDialogs } from '../../../components/AiValidationDialogs'; import { AiValidationDialogs } from './components/AiValidationDialogs';
import { Product } from '../../../types/product'; import { Product } from '../../../../types/products';
import { config } from '../../../config'; import {
AiValidationProgress,
interface CurrentPrompt { AiValidationDetails,
isOpen: boolean; CurrentPrompt as AiValidationCurrentPrompt
prompt: string; } from './hooks/useAiValidation';
isLoading: boolean;
debugData?: {
taxonomyStats: {
categories: number;
themes: number;
colors: number;
taxCodes: number;
sizeCategories: number;
suppliers: number;
companies: number;
artists: number;
} | null;
basePrompt: string;
sampleFullPrompt: string;
promptLength: number;
estimatedProcessingTime?: {
seconds: number | null;
sampleCount: number;
};
};
}
const ValidationStepNew: React.FC = () => { const ValidationStepNew: React.FC = () => {
const [aiValidationProgress, setAiValidationProgress] = useState(0); const [aiValidationProgress, setAiValidationProgress] = useState<AiValidationProgress>({
const [aiValidationDetails, setAiValidationDetails] = useState(''); isOpen: false,
const [currentPrompt, setCurrentPrompt] = useState<CurrentPrompt>({ status: 'idle',
step: 0
});
const [aiValidationDetails, setAiValidationDetails] = useState<AiValidationDetails>({
changes: [],
warnings: [],
changeDetails: [],
isOpen: false
});
const [currentPrompt, setCurrentPrompt] = useState<AiValidationCurrentPrompt>({
isOpen: false, isOpen: false,
prompt: '', prompt: '',
isLoading: true, isLoading: true,
}); });
const [isChangeReverted, setIsChangeReverted] = useState(false);
const [fieldData, setFieldData] = useState<Product[]>([]);
const showCurrentPrompt = async (products: Product[]) => { // Track reversion state (for internal use)
setCurrentPrompt((prev) => ({ ...prev, isOpen: true, isLoading: true })); const [reversionState, setReversionState] = useState<Record<string, boolean>>({});
try { const [fieldData] = useState<Product[]>([]);
// Get the prompt
const promptResponse = await fetch(`${config.apiUrl}/ai-validation/prompt`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ products })
});
if (!promptResponse.ok) { // eslint-disable-next-line @typescript-eslint/no-unused-vars
throw new Error('Failed to fetch AI prompt');
}
const promptData = await promptResponse.json(); const revertAiChange = (productIndex: number, fieldKey: string) => {
const key = `${productIndex}-${fieldKey}`;
// Get the debug data in the same request or as a separate request setReversionState(prev => ({
const debugResponse = await fetch(`${config.apiUrl}/ai-validation/debug-info`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ prompt: promptData.prompt })
});
let debugData;
if (debugResponse.ok) {
debugData = await debugResponse.json();
} else {
// If debug-info fails, use a fallback to get taxonomy stats
const fallbackResponse = await fetch(`${config.apiUrl}/ai-validation/debug`, {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ products: [products[0]] }) // Use first product for stats
});
if (fallbackResponse.ok) {
debugData = await fallbackResponse.json();
// Set promptLength correctly from the actual prompt
debugData.promptLength = promptData.prompt.length;
}
}
setCurrentPrompt((prev) => ({
...prev, ...prev,
prompt: promptData.prompt, [key]: true
isLoading: false,
debugData: debugData
})); }));
} catch (error) {
console.error('Error fetching prompt:', error);
setCurrentPrompt((prev) => ({
...prev,
prompt: 'Error loading prompt',
isLoading: false
}));
}
}; };
const revertAiChange = () => { const isChangeReverted = (productIndex: number, fieldKey: string): boolean => {
setIsChangeReverted(true); const key = `${productIndex}-${fieldKey}`;
return !!reversionState[key];
}; };
const getFieldDisplayValueWithHighlight = (value: string, highlight: string) => { const getFieldDisplayValueWithHighlight = (
// Implementation of getFieldDisplayValueWithHighlight _fieldKey: string,
originalValue: any,
correctedValue: any
) => {
return {
originalHtml: String(originalValue),
correctedHtml: String(correctedValue)
};
}; };
return ( return (

View File

@@ -8,7 +8,7 @@ import {
} from "@/components/ui/dialog"; } from "@/components/ui/dialog";
import { ScrollArea } from "@/components/ui/scroll-area"; import { ScrollArea } from "@/components/ui/scroll-area";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import { Loader2, CheckIcon } from "lucide-react"; import { Loader2, CheckIcon, XIcon } from "lucide-react";
import { Code } from "@/components/ui/code"; import { Code } from "@/components/ui/code";
import { import {
Table, Table,
@@ -24,6 +24,7 @@ import {
CurrentPrompt, CurrentPrompt,
} from "../hooks/useAiValidation"; } from "../hooks/useAiValidation";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card"; import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Badge } from "@/components/ui/badge";
interface TaxonomyStats { interface TaxonomyStats {
categories: number; categories: number;
@@ -41,6 +42,20 @@ interface DebugData {
basePrompt: string; basePrompt: string;
sampleFullPrompt: string; sampleFullPrompt: string;
promptLength: number; promptLength: number;
apiFormat?: Array<{
role: string;
content: string;
}>;
promptSources?: {
systemPrompt?: { id: number; prompt_text: string };
generalPrompt?: { id: number; prompt_text: string };
companyPrompts?: Array<{
id: number;
company: string;
companyName?: string;
prompt_text: string;
}>;
};
estimatedProcessingTime?: { estimatedProcessingTime?: {
seconds: number | null; seconds: number | null;
sampleCount: number; sampleCount: number;
@@ -83,6 +98,75 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
debugData, debugData,
}) => { }) => {
const [costPerMillionTokens, setCostPerMillionTokens] = useState(2.5); // Default cost const [costPerMillionTokens, setCostPerMillionTokens] = useState(2.5); // Default cost
const hasCompanyPrompts =
currentPrompt.debugData?.promptSources?.companyPrompts &&
currentPrompt.debugData.promptSources.companyPrompts.length > 0;
// Create our own state to track changes
const [localReversionState, setLocalReversionState] = useState<
Record<string, boolean>
>({});
// Initialize local state from the isChangeReverted function when component mounts
// or when aiValidationDetails changes
React.useEffect(() => {
if (
aiValidationDetails.changeDetails &&
aiValidationDetails.changeDetails.length > 0
) {
const initialState: Record<string, boolean> = {};
aiValidationDetails.changeDetails.forEach((product) => {
product.changes.forEach((change) => {
const key = `${product.productIndex}-${change.field}`;
initialState[key] = isChangeReverted(
product.productIndex,
change.field
);
});
});
setLocalReversionState(initialState);
}
}, [aiValidationDetails.changeDetails, isChangeReverted]);
// This function will toggle the local state for a given change
const toggleChangeAcceptance = (productIndex: number, fieldKey: string) => {
const key = `${productIndex}-${fieldKey}`;
const currentlyRejected = !!localReversionState[key];
// Toggle the local state
setLocalReversionState((prev) => ({
...prev,
[key]: !prev[key],
}));
// Only call revertAiChange when toggling to rejected state
// Since revertAiChange is specifically for rejecting changes
if (!currentlyRejected) {
revertAiChange(productIndex, fieldKey);
}
};
// Function to check local reversion state
const isChangeLocallyReverted = (
productIndex: number,
fieldKey: string
): boolean => {
const key = `${productIndex}-${fieldKey}`;
return !!localReversionState[key];
};
// Use "full" as the default tab
const defaultTab = "full";
const [activeTab, setActiveTab] = useState(defaultTab);
// Update activeTab when the dialog is opened with new data
React.useEffect(() => {
if (currentPrompt.isOpen) {
setActiveTab("full");
}
}, [currentPrompt.isOpen]);
// Format time helper // Format time helper
const formatTime = (seconds: number): string => { const formatTime = (seconds: number): string => {
@@ -123,15 +207,18 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
</DialogHeader> </DialogHeader>
<div className="flex flex-col h-[calc(90vh-120px)] overflow-hidden"> <div className="flex flex-col h-[calc(90vh-120px)] overflow-hidden">
{/* Debug Information Section */} {/* Debug Information Section - Fixed at the top */}
<div className="mb-4 flex-shrink-0"> <div className="flex-shrink-0">
{currentPrompt.isLoading ? ( {currentPrompt.isLoading ? (
<div className="flex justify-center items-center h-[100px]"></div> <div className="flex justify-center items-center h-[100px]"></div>
) : ( ) : (
<div className="grid grid-cols-3 gap-4"> <>
<div className="grid grid-cols-3 gap-4 mb-4">
<Card className="py-2"> <Card className="py-2">
<CardHeader className="py-2"> <CardHeader className="py-2">
<CardTitle className="text-base">Prompt Length</CardTitle> <CardTitle className="text-base">
Prompt Length
</CardTitle>
</CardHeader> </CardHeader>
<CardContent className="py-2"> <CardContent className="py-2">
<div className="flex flex-col space-y-2"> <div className="flex flex-col space-y-2">
@@ -139,10 +226,14 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
<span className="text-muted-foreground"> <span className="text-muted-foreground">
Characters: Characters:
</span>{" "} </span>{" "}
<span className="font-semibold">{promptLength}</span> <span className="font-semibold">
{promptLength}
</span>
</div> </div>
<div className="text-sm"> <div className="text-sm">
<span className="text-muted-foreground">Tokens:</span>{" "} <span className="text-muted-foreground">
Tokens:
</span>{" "}
<span className="font-semibold"> <span className="font-semibold">
~{Math.round(promptLength / 4)} ~{Math.round(promptLength / 4)}
</span> </span>
@@ -153,7 +244,9 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
<Card className="py-2"> <Card className="py-2">
<CardHeader className="py-2"> <CardHeader className="py-2">
<CardTitle className="text-base">Cost Estimate</CardTitle> <CardTitle className="text-base">
Cost Estimate
</CardTitle>
</CardHeader> </CardHeader>
<CardContent className="py-2"> <CardContent className="py-2">
<div className="flex flex-col space-y-2"> <div className="flex flex-col space-y-2">
@@ -200,8 +293,9 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
</CardHeader> </CardHeader>
<CardContent className="py-2"> <CardContent className="py-2">
<div className="flex flex-col space-y-2"> <div className="flex flex-col space-y-2">
{debugData?.estimatedProcessingTime ? ( {currentPrompt.debugData?.estimatedProcessingTime ? (
debugData.estimatedProcessingTime.seconds ? ( currentPrompt.debugData.estimatedProcessingTime
.seconds ? (
<> <>
<div className="text-sm"> <div className="text-sm">
<span className="text-muted-foreground"> <span className="text-muted-foreground">
@@ -209,23 +303,28 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
</span>{" "} </span>{" "}
<span className="font-semibold"> <span className="font-semibold">
{formatTime( {formatTime(
debugData.estimatedProcessingTime.seconds currentPrompt.debugData
.estimatedProcessingTime.seconds
)} )}
</span> </span>
</div> </div>
<div className="text-xs text-muted-foreground"> <div className="text-xs text-muted-foreground">
Based on{" "} Based on{" "}
{debugData.estimatedProcessingTime.sampleCount}{" "} {
currentPrompt.debugData
.estimatedProcessingTime.sampleCount
}{" "}
similar validation similar validation
{debugData.estimatedProcessingTime {currentPrompt.debugData
.sampleCount !== 1 .estimatedProcessingTime.sampleCount !== 1
? "s" ? "s"
: ""} : ""}
</div> </div>
</> </>
) : ( ) : (
<div className="text-sm text-muted-foreground"> <div className="text-sm text-muted-foreground">
No historical data available for this prompt size No historical data available for this prompt
size
</div> </div>
) )
) : ( ) : (
@@ -237,22 +336,304 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
</CardContent> </CardContent>
</Card> </Card>
</div> </div>
</>
)} )}
</div> </div>
{/* Prompt Section */} {/* Prompt Section - Scrollable content */}
<div className="flex-1 min-h-0"> <div className="flex-1 min-h-0">
<ScrollArea className="h-full w-full">
{currentPrompt.isLoading ? ( {currentPrompt.isLoading ? (
<div className="flex items-center justify-center h-full"> <div className="flex items-center justify-center h-full">
<Loader2 className="h-8 w-8 animate-spin" /> <Loader2 className="h-8 w-8 animate-spin" />
</div> </div>
) : ( ) : (
<>
{currentPrompt.debugData?.apiFormat ? (
<div className="flex flex-col h-full">
{/* Prompt Sources Card - Fixed at the top of the content area */}
<Card className="py-2 mb-4 flex-shrink-0">
<CardHeader className="py-2">
<CardTitle className="text-base">
Prompt Sources
</CardTitle>
</CardHeader>
<CardContent className="py-2">
<div className="flex flex-wrap gap-2">
<Badge
variant="outline"
className="bg-purple-100 hover:bg-purple-200 cursor-pointer"
onClick={() =>
document
.getElementById("system-message")
?.scrollIntoView({ behavior: "smooth" })
}
>
System
</Badge>
<Badge
variant="outline"
className="bg-green-100 hover:bg-green-200 cursor-pointer"
onClick={() =>
document
.getElementById("general-section")
?.scrollIntoView({ behavior: "smooth" })
}
>
General
</Badge>
{currentPrompt.debugData.promptSources?.companyPrompts?.map(
(company, idx) => (
<Badge
key={idx}
variant="outline"
className="bg-blue-100 hover:bg-blue-200 cursor-pointer"
onClick={() =>
document
.getElementById("company-section")
?.scrollIntoView({ behavior: "smooth" })
}
>
{company.companyName ||
`Company ${company.company}`}
</Badge>
)
)}
<Badge
variant="outline"
className="bg-amber-100 hover:bg-amber-200 cursor-pointer"
onClick={() =>
document
.getElementById("taxonomy-section")
?.scrollIntoView({ behavior: "smooth" })
}
>
Taxonomy
</Badge>
<Badge
variant="outline"
className="bg-pink-100 hover:bg-pink-200 cursor-pointer"
onClick={() =>
document
.getElementById("product-section")
?.scrollIntoView({ behavior: "smooth" })
}
>
Products
</Badge>
</div>
</CardContent>
</Card>
<ScrollArea className="flex-1 w-full overflow-y-auto">
{currentPrompt.debugData.apiFormat.map(
(message, idx: number) => (
<div
key={idx}
className="border rounded-md p-2 mb-4"
>
<div
id={
message.role === "system"
? "system-message"
: ""
}
className={`p-2 mb-2 rounded-sm font-medium ${
message.role === "system"
? "bg-purple-50 text-purple-800"
: "bg-green-50 text-green-800"
}`}
>
Role: {message.role}
</div>
<Code
className={`whitespace-pre-wrap p-4 break-normal max-w-full ${
message.role === "system"
? "bg-purple-50/30"
: "bg-green-50/30"
}`}
>
{message.role === "user" ? (
<div className="text-wrapper">
{(() => {
const content = message.content;
// Find section boundaries by looking for specific markers
const companySpecificStartIndex =
content.indexOf(
"--- COMPANY-SPECIFIC INSTRUCTIONS ---"
);
const companySpecificEndIndex =
content.indexOf(
"--- END COMPANY-SPECIFIC INSTRUCTIONS ---"
);
const taxonomyStartIndex =
content.indexOf(
"All Available Categories:"
);
const taxonomyFallbackStartIndex =
content.indexOf(
"Available Categories:"
);
const actualTaxonomyStartIndex =
taxonomyStartIndex >= 0
? taxonomyStartIndex
: taxonomyFallbackStartIndex;
const productDataStartIndex =
content.indexOf(
"----------Here is the product data to validate----------"
);
// If we can't find any markers, just return the content as-is
if (
actualTaxonomyStartIndex < 0 &&
productDataStartIndex < 0 &&
companySpecificStartIndex < 0
) {
return content;
}
// Determine section indices
let generalEndIndex = content.length;
if (companySpecificStartIndex >= 0) {
generalEndIndex =
companySpecificStartIndex;
} else if (
actualTaxonomyStartIndex >= 0
) {
generalEndIndex =
actualTaxonomyStartIndex;
} else if (productDataStartIndex >= 0) {
generalEndIndex = productDataStartIndex;
}
// Determine where taxonomy starts
let taxonomyEndIndex = content.length;
if (productDataStartIndex >= 0) {
taxonomyEndIndex =
productDataStartIndex;
}
// Segments to render with appropriate styling
const segments = [];
// General section (beginning to company/taxonomy/product)
if (generalEndIndex > 0) {
segments.push(
<div
id="general-section"
key="general"
className="border-l-4 border-green-500 pl-4 py-0 my-1"
>
<div className="text-xs font-semibold text-green-700 mb-2">
General Prompt
</div>
<pre className="whitespace-pre-wrap">
{content.substring(
0,
generalEndIndex
)}
</pre>
</div>
);
}
// Company-specific section if present
if (
companySpecificStartIndex >= 0 &&
companySpecificEndIndex >= 0
) {
segments.push(
<div
id="company-section"
key="company"
className="border-l-4 border-blue-500 pl-4 py-0 my-1"
>
<div className="text-xs font-semibold text-blue-700 mb-2">
Company-Specific Instructions
</div>
<pre className="whitespace-pre-wrap">
{content.substring(
companySpecificStartIndex,
companySpecificEndIndex +
"--- END COMPANY-SPECIFIC INSTRUCTIONS ---"
.length
)}
</pre>
</div>
);
}
// Taxonomy section
if (actualTaxonomyStartIndex >= 0) {
const taxEnd = taxonomyEndIndex;
segments.push(
<div
id="taxonomy-section"
key="taxonomy"
className="border-l-4 border-amber-500 pl-4 py-0 my-1"
>
<div className="text-xs font-semibold text-amber-700 mb-2">
Taxonomy Data
</div>
<pre className="whitespace-pre-wrap">
{content.substring(
actualTaxonomyStartIndex,
taxEnd
)}
</pre>
</div>
);
}
// Product data section
if (productDataStartIndex >= 0) {
segments.push(
<div
id="product-section"
key="product"
className="border-l-4 border-pink-500 pl-4 py-0 my-1"
>
<div className="text-xs font-semibold text-pink-700 mb-2">
Product Data
</div>
<pre className="whitespace-pre-wrap">
{content.substring(
productDataStartIndex
)}
</pre>
</div>
);
}
return <>{segments}</>;
})()}
</div>
) : (
<pre className="whitespace-pre-wrap">
{message.content}
</pre>
)}
</Code>
</div>
)
)}
</ScrollArea>
</div>
) : (
<ScrollArea className="h-full w-full">
<Code className="whitespace-pre-wrap p-4 break-normal max-w-full"> <Code className="whitespace-pre-wrap p-4 break-normal max-w-full">
{currentPrompt.prompt} {currentPrompt.prompt}
</Code> </Code>
)}
</ScrollArea> </ScrollArea>
)}
</>
)}
</div> </div>
</div> </div>
</DialogContent> </DialogContent>
@@ -280,8 +661,9 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
className="h-full bg-primary transition-all duration-500" className="h-full bg-primary transition-all duration-500"
style={{ style={{
width: `${ width: `${
aiValidationProgress.progressPercent ?? aiValidationProgress.progressPercent !== undefined
Math.round((aiValidationProgress.step / 5) * 100) ? Math.round(aiValidationProgress.progressPercent)
: Math.round((aiValidationProgress.step / 5) * 100)
}%`, }%`,
backgroundColor: backgroundColor:
aiValidationProgress.step === -1 aiValidationProgress.step === -1
@@ -295,8 +677,9 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
{aiValidationProgress.step === -1 {aiValidationProgress.step === -1
? "❌" ? "❌"
: `${ : `${
aiValidationProgress.progressPercent ?? aiValidationProgress.progressPercent !== undefined
Math.round((aiValidationProgress.step / 5) * 100) ? Math.round(aiValidationProgress.progressPercent)
: Math.round((aiValidationProgress.step / 5) * 100)
}%`} }%`}
</div> </div>
</div> </div>
@@ -355,14 +738,14 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
setAiValidationDetails((prev) => ({ ...prev, isOpen: open })) setAiValidationDetails((prev) => ({ ...prev, isOpen: open }))
} }
> >
<DialogContent className="max-w-4xl"> <DialogContent className="max-w-6xl w-[90vw]">
<DialogHeader> <DialogHeader>
<DialogTitle>AI Validation Results</DialogTitle> <DialogTitle>AI Validation Results</DialogTitle>
<DialogDescription> <DialogDescription>
Review the changes and warnings suggested by the AI Review the changes and warnings suggested by the AI
</DialogDescription> </DialogDescription>
</DialogHeader> </DialogHeader>
<ScrollArea className="max-h-[60vh]"> <ScrollArea className="max-h-[70vh]">
{aiValidationDetails.changeDetails && {aiValidationDetails.changeDetails &&
aiValidationDetails.changeDetails.length > 0 ? ( aiValidationDetails.changeDetails.length > 0 ? (
<div className="mb-6 space-y-6"> <div className="mb-6 space-y-6">
@@ -384,10 +767,16 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
<Table> <Table>
<TableHeader> <TableHeader>
<TableRow> <TableRow>
<TableHead className="w-[180px]">Field</TableHead> <TableHead className="">Field</TableHead>
<TableHead>Original Value</TableHead> <TableHead className="w-[35%]">
<TableHead>Corrected Value</TableHead> Original Value
<TableHead className="text-right">Action</TableHead> </TableHead>
<TableHead className="w-[35%]">
Corrected Value
</TableHead>
<TableHead className="text-right">
Accept Changes?
</TableHead>
</TableRow> </TableRow>
</TableHeader> </TableHeader>
<TableBody> <TableBody>
@@ -398,7 +787,7 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
const fieldLabel = field const fieldLabel = field
? field.label ? field.label
: change.field; : change.field;
const isReverted = isChangeReverted( const isReverted = isChangeLocallyReverted(
product.productIndex, product.productIndex,
change.field change.field
); );
@@ -421,7 +810,6 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: originalHtml, __html: originalHtml,
}} }}
className={isReverted ? "font-medium" : ""}
/> />
</TableCell> </TableCell>
<TableCell> <TableCell>
@@ -429,36 +817,46 @@ export const AiValidationDialogs: React.FC<AiValidationDialogsProps> = ({
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={{
__html: correctedHtml, __html: correctedHtml,
}} }}
className={!isReverted ? "font-medium" : ""}
/> />
</TableCell> </TableCell>
<TableCell className="text-right"> <TableCell className="text-right align-top">
<div className="mt-2"> <div className="flex justify-end gap-2">
{isReverted ? (
<Button
variant="ghost"
size="sm"
className="text-green-600 bg-green-50 hover:bg-green-100 hover:text-green-700"
disabled
>
<CheckIcon className="w-4 h-4 mr-1" />
Reverted
</Button>
) : (
<Button <Button
variant="outline" variant="outline"
size="sm" size="sm"
onClick={() => { onClick={() => {
// Call the revert function directly // Toggle to Accepted state if currently rejected
revertAiChange( toggleChangeAcceptance(
product.productIndex, product.productIndex,
change.field change.field
); );
}} }}
className={
!isReverted
? "bg-green-100 text-green-600 border-green-300 flex items-center"
: "border-gray-200 text-gray-600 hover:bg-green-50 hover:text-green-600 hover:border-green-200 flex items-center"
}
> >
Revert Change <CheckIcon className="h-4 w-4" />
</Button>
<Button
variant="outline"
size="sm"
onClick={() => {
// Toggle to Rejected state if currently accepted
toggleChangeAcceptance(
product.productIndex,
change.field
);
}}
className={
isReverted
? "bg-red-100 text-red-600 border-red-300 flex items-center"
: "border-gray-200 text-gray-600 hover:bg-red-50 hover:text-red-600 hover:border-red-200 flex items-center"
}
>
<XIcon className="h-4 w-4" />
</Button> </Button>
)}
</div> </div>
</TableCell> </TableCell>
</TableRow> </TableRow>

View File

@@ -56,6 +56,20 @@ export interface CurrentPrompt {
basePrompt: string; basePrompt: string;
sampleFullPrompt: string; sampleFullPrompt: string;
promptLength: number; promptLength: number;
apiFormat?: Array<{
role: string;
content: string;
}>;
promptSources?: {
systemPrompt?: { id: number; prompt_text: string };
generalPrompt?: { id: number; prompt_text: string };
companyPrompts?: Array<{
id: number;
company: string;
companyName: string;
prompt_text: string
}>;
};
estimatedProcessingTime?: { estimatedProcessingTime?: {
seconds: number | null; seconds: number | null;
sampleCount: number; sampleCount: number;
@@ -323,7 +337,9 @@ export const useAiValidation = <T extends string>(
basePrompt: result.basePrompt || '', basePrompt: result.basePrompt || '',
sampleFullPrompt: result.sampleFullPrompt || '', sampleFullPrompt: result.sampleFullPrompt || '',
promptLength: result.promptLength || (promptContent ? promptContent.length : 0), promptLength: result.promptLength || (promptContent ? promptContent.length : 0),
estimatedProcessingTime: result.estimatedProcessingTime promptSources: result.promptSources,
estimatedProcessingTime: result.estimatedProcessingTime,
apiFormat: result.apiFormat
} }
})); }));
} else { } else {
@@ -490,6 +506,27 @@ export const useAiValidation = <T extends string>(
throw new Error(result.error || 'AI validation failed'); throw new Error(result.error || 'AI validation failed');
} }
// Store the prompt sources if they exist
if (result.promptSources) {
setCurrentPrompt(prev => {
// Create debugData if it doesn't exist
const prevDebugData = prev.debugData || {
taxonomyStats: null,
basePrompt: '',
sampleFullPrompt: '',
promptLength: 0
};
return {
...prev,
debugData: {
...prevDebugData,
promptSources: result.promptSources
}
};
});
}
// Update progress with actual processing time if available // Update progress with actual processing time if available
if (result.performanceMetrics) { if (result.performanceMetrics) {
console.log('Performance metrics:', result.performanceMetrics); console.log('Performance metrics:', result.performanceMetrics);

View File

@@ -0,0 +1,584 @@
import { useState, useMemo } from "react";
import { useQuery, useMutation, useQueryClient } from "@tanstack/react-query";
import { Button } from "@/components/ui/button";
import {
Table,
TableBody,
TableCell,
TableHead,
TableHeader,
TableRow,
} from "@/components/ui/table";
import { Input } from "@/components/ui/input";
import { Textarea } from "@/components/ui/textarea";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import { Label } from "@/components/ui/label";
import { ArrowUpDown, Pencil, Trash2, PlusCircle } from "lucide-react";
import config from "@/config";
import {
useReactTable,
getCoreRowModel,
getSortedRowModel,
SortingState,
flexRender,
type ColumnDef,
} from "@tanstack/react-table";
import {
Dialog,
DialogContent,
DialogDescription,
DialogFooter,
DialogHeader,
DialogTitle,
} from "@/components/ui/dialog";
import {
AlertDialog,
AlertDialogAction,
AlertDialogCancel,
AlertDialogContent,
AlertDialogDescription,
AlertDialogFooter,
AlertDialogHeader,
AlertDialogTitle,
} from "@/components/ui/alert-dialog";
import { toast } from "sonner";
interface FieldOption {
label: string;
value: string;
}
interface PromptFormData {
id?: number;
prompt_text: string;
prompt_type: 'general' | 'company_specific' | 'system';
company: string | null;
}
interface AiPrompt {
id: number;
prompt_text: string;
prompt_type: 'general' | 'company_specific' | 'system';
company: string | null;
created_at: string;
updated_at: string;
}
interface FieldOptions {
companies: FieldOption[];
}
export function PromptManagement() {
const [isFormOpen, setIsFormOpen] = useState(false);
const [isDeleteOpen, setIsDeleteOpen] = useState(false);
const [promptToDelete, setPromptToDelete] = useState<AiPrompt | null>(null);
const [editingPrompt, setEditingPrompt] = useState<AiPrompt | null>(null);
const [sorting, setSorting] = useState<SortingState>([
{ id: "prompt_type", desc: true },
{ id: "company", desc: false }
]);
const [searchQuery, setSearchQuery] = useState("");
const [formData, setFormData] = useState<PromptFormData>({
prompt_text: "",
prompt_type: "general",
company: null,
});
const queryClient = useQueryClient();
const { data: prompts, isLoading } = useQuery<AiPrompt[]>({
queryKey: ["ai-prompts"],
queryFn: async () => {
const response = await fetch(`${config.apiUrl}/ai-prompts`);
if (!response.ok) {
throw new Error("Failed to fetch AI prompts");
}
return response.json();
},
});
const { data: fieldOptions } = useQuery<FieldOptions>({
queryKey: ["fieldOptions"],
queryFn: async () => {
const response = await fetch(`${config.apiUrl}/import/field-options`);
if (!response.ok) {
throw new Error("Failed to fetch field options");
}
return response.json();
},
});
// Check if general and system prompts already exist
const generalPromptExists = useMemo(() => {
return prompts?.some(prompt => prompt.prompt_type === 'general');
}, [prompts]);
const systemPromptExists = useMemo(() => {
return prompts?.some(prompt => prompt.prompt_type === 'system');
}, [prompts]);
const createMutation = useMutation({
mutationFn: async (data: PromptFormData) => {
const response = await fetch(`${config.apiUrl}/ai-prompts`, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
if (!response.ok) {
const error = await response.json();
throw new Error(error.message || error.error || "Failed to create prompt");
}
return response.json();
},
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ["ai-prompts"] });
toast.success("Prompt created successfully");
resetForm();
},
onError: (error) => {
toast.error(error instanceof Error ? error.message : "Failed to create prompt");
},
});
const updateMutation = useMutation({
mutationFn: async (data: PromptFormData) => {
if (!data.id) throw new Error("Prompt ID is required for update");
const response = await fetch(`${config.apiUrl}/ai-prompts/${data.id}`, {
method: "PUT",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify(data),
});
if (!response.ok) {
const error = await response.json();
throw new Error(error.message || error.error || "Failed to update prompt");
}
return response.json();
},
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ["ai-prompts"] });
toast.success("Prompt updated successfully");
resetForm();
},
onError: (error) => {
toast.error(error instanceof Error ? error.message : "Failed to update prompt");
},
});
const deleteMutation = useMutation({
mutationFn: async (id: number) => {
const response = await fetch(`${config.apiUrl}/ai-prompts/${id}`, {
method: "DELETE",
});
if (!response.ok) {
throw new Error("Failed to delete prompt");
}
},
onSuccess: () => {
queryClient.invalidateQueries({ queryKey: ["ai-prompts"] });
toast.success("Prompt deleted successfully");
},
onError: (error) => {
toast.error(error instanceof Error ? error.message : "Failed to delete prompt");
},
});
const handleEdit = (prompt: AiPrompt) => {
setEditingPrompt(prompt);
setFormData({
id: prompt.id,
prompt_text: prompt.prompt_text,
prompt_type: prompt.prompt_type,
company: prompt.company,
});
setIsFormOpen(true);
};
const handleDeleteClick = (prompt: AiPrompt) => {
setPromptToDelete(prompt);
setIsDeleteOpen(true);
};
const handleDeleteConfirm = () => {
if (promptToDelete) {
deleteMutation.mutate(promptToDelete.id);
setIsDeleteOpen(false);
setPromptToDelete(null);
}
};
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
// If prompt_type is general or system, ensure company is null
const submitData = {
...formData,
company: formData.prompt_type === 'company_specific' ? formData.company : null,
};
if (editingPrompt) {
updateMutation.mutate(submitData);
} else {
createMutation.mutate(submitData);
}
};
const resetForm = () => {
setFormData({
prompt_text: "",
prompt_type: "general",
company: null,
});
setEditingPrompt(null);
setIsFormOpen(false);
};
const handleCreateClick = () => {
resetForm();
// If general prompt and system prompt exist, default to company-specific
if (generalPromptExists && systemPromptExists) {
setFormData(prev => ({
...prev,
prompt_type: 'company_specific'
}));
} else if (generalPromptExists && !systemPromptExists) {
// If general exists but system doesn't, suggest system prompt
setFormData(prev => ({
...prev,
prompt_type: 'system'
}));
} else if (!generalPromptExists) {
// If no general prompt, suggest that first
setFormData(prev => ({
...prev,
prompt_type: 'general'
}));
}
setIsFormOpen(true);
};
const columns = useMemo<ColumnDef<AiPrompt>[]>(() => [
{
accessorKey: "prompt_type",
header: ({ column }) => (
<Button
variant="ghost"
onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
>
Type
<ArrowUpDown className="ml-2 h-4 w-4" />
</Button>
),
cell: ({ row }) => {
const type = row.getValue("prompt_type") as string;
if (type === 'general') return 'General';
if (type === 'system') return 'System';
return 'Company Specific';
},
},
{
accessorFn: (row) => row.prompt_text.length,
id: "length",
header: ({ column }) => (
<Button
variant="ghost"
onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
>
Length
<ArrowUpDown className="ml-2 h-4 w-4" />
</Button>
),
cell: ({ getValue }) => {
const length = getValue() as number;
return <span>{length.toLocaleString()}</span>;
},
},
{
accessorKey: "company",
header: ({ column }) => (
<Button
variant="ghost"
onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
>
Company
<ArrowUpDown className="ml-2 h-4 w-4" />
</Button>
),
cell: ({ row }) => {
const companyId = row.getValue("company");
if (!companyId) return 'N/A';
return fieldOptions?.companies.find(c => c.value === companyId)?.label || companyId;
},
},
{
accessorKey: "updated_at",
header: ({ column }) => (
<Button
variant="ghost"
onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
>
Last Updated
<ArrowUpDown className="ml-2 h-4 w-4" />
</Button>
),
cell: ({ row }) => new Date(row.getValue("updated_at")).toLocaleDateString(),
},
{
id: "actions",
cell: ({ row }) => (
<div className="flex gap-2 justify-end pr-4">
<Button
variant="ghost"
onClick={() => handleEdit(row.original)}
>
<Pencil className="h-4 w-4" />
Edit
</Button>
<Button
variant="ghost"
className="text-destructive hover:text-destructive"
onClick={() => handleDeleteClick(row.original)}
>
<Trash2 className="h-4 w-4" />
Delete
</Button>
</div>
),
},
], [fieldOptions]);
const filteredData = useMemo(() => {
if (!prompts) return [];
return prompts.filter((prompt) => {
const searchString = searchQuery.toLowerCase();
return (
prompt.prompt_type.toLowerCase().includes(searchString) ||
(prompt.company && prompt.company.toLowerCase().includes(searchString))
);
});
}, [prompts, searchQuery]);
const table = useReactTable({
data: filteredData,
columns,
state: {
sorting,
},
onSortingChange: setSorting,
getSortedRowModel: getSortedRowModel(),
getCoreRowModel: getCoreRowModel(),
});
return (
<div className="space-y-6">
<div className="flex items-center justify-between">
<h2 className="text-2xl font-bold">AI Validation Prompts</h2>
<Button onClick={handleCreateClick}>
<PlusCircle className="mr-2 h-4 w-4" />
Create New Prompt
</Button>
</div>
<div className="flex items-center gap-4">
<Input
placeholder="Search prompts..."
value={searchQuery}
onChange={(e) => setSearchQuery(e.target.value)}
className="max-w-sm"
/>
</div>
{isLoading ? (
<div>Loading prompts...</div>
) : (
<div className="border rounded-lg">
<Table>
<TableHeader className="bg-muted">
{table.getHeaderGroups().map((headerGroup) => (
<TableRow key={headerGroup.id}>
{headerGroup.headers.map((header) => (
<TableHead key={header.id}>
{header.isPlaceholder
? null
: flexRender(
header.column.columnDef.header,
header.getContext()
)}
</TableHead>
))}
</TableRow>
))}
</TableHeader>
<TableBody>
{table.getRowModel().rows?.length ? (
table.getRowModel().rows.map((row) => (
<TableRow key={row.id} className="hover:bg-gray-100">
{row.getVisibleCells().map((cell) => (
<TableCell key={cell.id} className="pl-6">
{flexRender(cell.column.columnDef.cell, cell.getContext())}
</TableCell>
))}
</TableRow>
))
) : (
<TableRow>
<TableCell colSpan={columns.length} className="text-center">
No prompts found
</TableCell>
</TableRow>
)}
</TableBody>
</Table>
</div>
)}
{/* Prompt Form Dialog */}
<Dialog open={isFormOpen} onOpenChange={setIsFormOpen}>
<DialogContent className="max-w-3xl">
<DialogHeader>
<DialogTitle>{editingPrompt ? "Edit Prompt" : "Create New Prompt"}</DialogTitle>
<DialogDescription>
{editingPrompt
? "Update this AI validation prompt."
: "Create a new AI validation prompt that will be used during product validation."}
</DialogDescription>
</DialogHeader>
<form onSubmit={handleSubmit}>
<div className="grid gap-4 py-4">
<div className="grid gap-2">
<Label htmlFor="prompt_type">Prompt Type</Label>
<Select
value={formData.prompt_type}
onValueChange={(value: 'general' | 'company_specific' | 'system') =>
setFormData({ ...formData, prompt_type: value })
}
disabled={(generalPromptExists && formData.prompt_type !== 'general' && !editingPrompt?.id) ||
(systemPromptExists && formData.prompt_type !== 'system' && !editingPrompt?.id)}
>
<SelectTrigger>
<SelectValue placeholder="Select prompt type" />
</SelectTrigger>
<SelectContent>
<SelectItem
value="general"
disabled={generalPromptExists && !editingPrompt?.prompt_type?.includes('general')}
>
General
</SelectItem>
<SelectItem
value="system"
disabled={systemPromptExists && !editingPrompt?.prompt_type?.includes('system')}
>
System
</SelectItem>
<SelectItem value="company_specific">Company Specific</SelectItem>
</SelectContent>
</Select>
{generalPromptExists && formData.prompt_type !== 'general' && !editingPrompt?.id && systemPromptExists && formData.prompt_type !== 'system' && (
<p className="text-xs text-muted-foreground">
General and system prompts already exist. You can only create company-specific prompts.
</p>
)}
{generalPromptExists && !systemPromptExists && formData.prompt_type !== 'general' && !editingPrompt?.id && (
<p className="text-xs text-muted-foreground">
A general prompt already exists. You can create a system prompt or company-specific prompts.
</p>
)}
{systemPromptExists && !generalPromptExists && formData.prompt_type !== 'system' && !editingPrompt?.id && (
<p className="text-xs text-muted-foreground">
A system prompt already exists. You can create a general prompt or company-specific prompts.
</p>
)}
</div>
{formData.prompt_type === 'company_specific' && (
<div className="grid gap-2">
<Label htmlFor="company">Company</Label>
<Select
value={formData.company || ''}
onValueChange={(value) => setFormData({ ...formData, company: value })}
required={formData.prompt_type === 'company_specific'}
>
<SelectTrigger>
<SelectValue placeholder="Select company" />
</SelectTrigger>
<SelectContent>
{fieldOptions?.companies.map((company) => (
<SelectItem key={company.value} value={company.value}>
{company.label}
</SelectItem>
))}
</SelectContent>
</Select>
</div>
)}
<div className="grid gap-2">
<Label htmlFor="prompt_text">Prompt Text</Label>
<Textarea
id="prompt_text"
value={formData.prompt_text}
onChange={(e) => setFormData({ ...formData, prompt_text: e.target.value })}
placeholder={`Enter your ${formData.prompt_type === 'system' ? 'system instructions' : 'validation prompt'} text...`}
className="h-80 font-mono text-sm"
required
/>
{formData.prompt_type === 'system' && (
<p className="text-xs text-muted-foreground mt-1">
System prompts provide the initial instructions to the AI. This sets the tone and approach for all validations.
</p>
)}
</div>
</div>
<DialogFooter>
<Button type="button" variant="outline" onClick={() => {
resetForm();
setIsFormOpen(false);
}}>
Cancel
</Button>
<Button type="submit">
{editingPrompt ? "Update" : "Create"} Prompt
</Button>
</DialogFooter>
</form>
</DialogContent>
</Dialog>
{/* Delete Confirmation Dialog */}
<AlertDialog open={isDeleteOpen} onOpenChange={setIsDeleteOpen}>
<AlertDialogContent>
<AlertDialogHeader>
<AlertDialogTitle>Delete Prompt</AlertDialogTitle>
<AlertDialogDescription>
Are you sure you want to delete this prompt? This action cannot be undone.
</AlertDialogDescription>
</AlertDialogHeader>
<AlertDialogFooter>
<AlertDialogCancel onClick={() => {
setIsDeleteOpen(false);
setPromptToDelete(null);
}}>
Cancel
</AlertDialogCancel>
<AlertDialogAction onClick={handleDeleteConfirm}>
Delete
</AlertDialogAction>
</AlertDialogFooter>
</AlertDialogContent>
</AlertDialog>
</div>
);
}

View File

@@ -5,6 +5,7 @@ import { PerformanceMetrics } from "@/components/settings/PerformanceMetrics";
import { CalculationSettings } from "@/components/settings/CalculationSettings"; import { CalculationSettings } from "@/components/settings/CalculationSettings";
import { TemplateManagement } from "@/components/settings/TemplateManagement"; import { TemplateManagement } from "@/components/settings/TemplateManagement";
import { UserManagement } from "@/components/settings/UserManagement"; import { UserManagement } from "@/components/settings/UserManagement";
import { PromptManagement } from "@/components/settings/PromptManagement";
import { motion } from 'framer-motion'; import { motion } from 'framer-motion';
import { Alert, AlertDescription } from "@/components/ui/alert"; import { Alert, AlertDescription } from "@/components/ui/alert";
import { Protected } from "@/components/auth/Protected"; import { Protected } from "@/components/auth/Protected";
@@ -41,6 +42,7 @@ const SETTINGS_GROUPS: SettingsGroup[] = [
label: "Content Management", label: "Content Management",
tabs: [ tabs: [
{ id: "templates", permission: "settings:templates", label: "Template Management" }, { id: "templates", permission: "settings:templates", label: "Template Management" },
{ id: "ai-prompts", permission: "settings:templates", label: "AI Prompts" },
] ]
}, },
{ {
@@ -216,6 +218,21 @@ export function Settings() {
</Protected> </Protected>
</TabsContent> </TabsContent>
<TabsContent value="ai-prompts" className="mt-0 focus-visible:outline-none focus-visible:ring-0">
<Protected
permission="settings:templates"
fallback={
<Alert>
<AlertDescription>
You don't have permission to access AI Prompts.
</AlertDescription>
</Alert>
}
>
<PromptManagement />
</Protected>
</TabsContent>
<TabsContent value="user-management" className="mt-0 focus-visible:outline-none focus-visible:ring-0"> <TabsContent value="user-management" className="mt-0 focus-visible:outline-none focus-visible:ring-0">
<Protected <Protected
permission="settings:user_management" permission="settings:user_management"

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@@ -166,6 +166,12 @@ export default defineConfig(function (_a) {
}); });
}, },
}, },
"/uploads": {
target: "https://inventory.kent.pw",
changeOrigin: true,
secure: false,
rewrite: function (path) { return path; },
},
}, },
}, },
build: { build: {