Improve dashboard charts, category tree selects, and product AI name fill.

Fix RTL chart ordering with Y-axis and hover values; aggregate website views; refine category picker tree borders and spacing; add one-click FA→EN name translation on add product.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/customer/src/components/CategorySearchSelect.tsx

@@ -96,6 +96,13 @@ function filterCategoryTree(
   return flat.filter((item) => matchedIds.has(item.id))
 }
 
+function isLastChildBeforeParent(items: FlatCategoryOption[], index: number): boolean {
+  const current = items[index]
+  if (current.depth === 0) return false
+  const next = items[index + 1]
+  return !next || next.depth < current.depth
+}
+
 export function CategorySearchSelect({
   options,
   value,
@@ -202,13 +209,14 @@ export function CategorySearchSelect({
           {filtered.length === 0 ? (
             <li className={styles.noResults}>{t('myProducts.fields.noCategories')}</li>
           ) : (
-            filtered.map((option) => (
+            filtered.map((option, index) => (
               <li key={option.id}>
                 <button
                   type="button"
                   className={[
                     styles.option,
                     option.depth > 0 ? styles.optionChild : '',
+                    isLastChildBeforeParent(filtered, index) ? styles.optionChildGroupEnd : '',
                     value === option.id ? styles.optionSelected : '',
                   ]
                     .filter(Boolean)
@@ -216,7 +224,7 @@ export function CategorySearchSelect({
                   style={
                     option.depth > 0
                       ? {
-                          marginInlineStart: `${option.depth * 22}px`,
+                          marginInlineStart: `${option.depth * 28}px`,
                         }
                       : undefined
                   }