Add business workshop management UI with Jalali scheduling and shared dashboard polish.

Includes workshop list/edit/details, registrations modal, category tree, shared EmptyState/RichTextEditor/toasts, and fixes for the Jalali date picker and thumbnail field layout.

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

apps/business/src/components/PickStoreSpecialItemsModal.tsx

@@ -4,7 +4,9 @@ import { X } from 'lucide-react'
 import { useLocale } from '@meshkee/dashboard-ui'
 import { useT } from '../i18n/useT'
 import { ApiError } from '../lib/api'
+import { listAllProducts } from '../services/productService'
 import { listAllStoreItems } from '../services/storeItemService'
+import type { SpecialProductsSource } from '../services/settingsService'
 import { groupStoreItemsByProduct } from '../utils/storeProductGroups'
 import {
   StoreItemMultiSearchSelect,
@@ -16,9 +18,11 @@ import styles from './PickStoreSpecialItemsModal.module.css'
 interface PickStoreSpecialItemsModalProps {
   open: boolean
   specialTitle: string
-  existingStoreItemIds: string[]
+  /** Store item ids when source is store_item; product ids when source is product. */
+  existingIds: string[]
+  source: SpecialProductsSource
   onClose: () => void
-  onConfirm: (storeItemIds: string[]) => void
+  onConfirm: (ids: string[]) => void
   isSubmitting?: boolean
 }
 
@@ -27,7 +31,8 @@ const ANIMATION_MS = 220
 export function PickStoreSpecialItemsModal({
   open,
   specialTitle,
-  existingStoreItemIds,
+  existingIds,
+  source,
   onClose,
   onConfirm,
   isSubmitting = false,
@@ -35,6 +40,7 @@ export function PickStoreSpecialItemsModal({
   const t = useT()
   const { locale } = useLocale()
   const isFa = locale === 'fa'
+  const fromProducts = source === 'product'
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [options, setOptions] = useState<StoreItemSearchOption[]>([])
@@ -43,7 +49,7 @@ export function PickStoreSpecialItemsModal({
   const [selectedIds, setSelectedIds] = useState<string[]>([])
   const [selectOpen, setSelectOpen] = useState(false)
 
-  const existingSet = useMemo(() => new Set(existingStoreItemIds), [existingStoreItemIds])
+  const existingSet = useMemo(() => new Set(existingIds), [existingIds])
 
   useEffect(() => {
     if (open) {
@@ -67,7 +73,7 @@ export function PickStoreSpecialItemsModal({
     const controller = new AbortController()
     void loadOptions(controller.signal)
     return () => controller.abort()
-  }, [open, existingStoreItemIds])
+  }, [open, existingIds, source])
 
   useEffect(() => {
     if (!mounted || closing) return
@@ -83,51 +89,68 @@ export function PickStoreSpecialItemsModal({
     setError('')
 
     try {
-      const items = await listAllStoreItems(signal)
-      const listings = groupStoreItemsByProduct(items)
-      const nextOptions = listings
-        .map(
-          (listing): StoreItemSearchOption | null => {
-          const storeItemId = listing.representative.storeItemId ?? listing.representative.id
-          const firstPricedVariant = listing.variants.find((v) => v.price !== null) ?? null
-          const price = firstPricedVariant?.price ?? null
-          const hasPrice = listing.variants.some((v) => v.price !== null)
-          const hasInStock = listing.variants.some(
-            (v) => v.stockQuantity === null || v.stockQuantity > 0,
-          )
+      const nextOptions = fromProducts
+        ? await loadProductOptions(signal)
+        : await loadStoreItemOptions(signal)
 
-          if (!hasPrice && !hasInStock) return null
-
-          return {
-            id: storeItemId,
-            title: listing.productTitle,
-            nameFa: listing.productNameFa,
-            image: listing.productImage,
-            price,
-          }
-          },
-        )
-        .filter((option): option is StoreItemSearchOption => option !== null)
-        .filter((option) => !existingSet.has(option.id))
-
-      setOptions(nextOptions)
+      setOptions(nextOptions.filter((option) => !existingSet.has(option.id)))
     } catch (err) {
       if (err instanceof DOMException && err.name === 'AbortError') return
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError(t('website.specialItems.pickErrorLoad'))
+        setError(
+          fromProducts
+            ? t('website.specialItems.pickErrorLoadProducts')
+            : t('website.specialItems.pickErrorLoad'),
+        )
       }
     } finally {
       setIsLoading(false)
     }
   }
 
-  function toggleSelection(storeItemId: string) {
+  async function loadStoreItemOptions(signal?: AbortSignal) {
+    const items = await listAllStoreItems(signal)
+    const listings = groupStoreItemsByProduct(items)
+    return listings
+      .map((listing): StoreItemSearchOption | null => {
+        const storeItemId = listing.representative.storeItemId ?? listing.representative.id
+        const firstPricedVariant = listing.variants.find((v) => v.price !== null) ?? null
+        const price = firstPricedVariant?.price ?? null
+        const hasPrice = listing.variants.some((v) => v.price !== null)
+        const hasInStock = listing.variants.some(
+          (v) => v.stockQuantity === null || v.stockQuantity > 0,
+        )
+
+        if (!hasPrice && !hasInStock) return null
+
+        return {
+          id: storeItemId,
+          title: listing.productTitle,
+          nameFa: listing.productNameFa,
+          image: listing.productImage,
+          price,
+        }
+      })
+      .filter((option): option is StoreItemSearchOption => option !== null)
+  }
+
+  async function loadProductOptions(signal?: AbortSignal) {
+    const products = await listAllProducts(signal)
+    return products.map(
+      (product): StoreItemSearchOption => ({
+        id: product.id,
+        title: product.title,
+        nameFa: product.nameFa,
+        image: product.thumbnailUrl || product.thumbnail || product.image || null,
+      }),
+    )
+  }
+
+  function toggleSelection(id: string) {
     setSelectedIds((prev) =>
-      prev.includes(storeItemId)
-        ? prev.filter((id) => id !== storeItemId)
-        : [...prev, storeItemId],
+      prev.includes(id) ? prev.filter((entry) => entry !== id) : [...prev, id],
     )
   }
 
@@ -167,7 +190,11 @@ export function PickStoreSpecialItemsModal({
             <h2 id="pick-special-items-title" className={modalStyles.title}>
               {t('website.pick.addTo', { title: specialTitle })}
             </h2>
-            <p className={modalStyles.subtitle}>{t('website.specialItems.pickSubtitle')}</p>
+            <p className={modalStyles.subtitle}>
+              {fromProducts
+                ? t('website.specialItems.pickSubtitleProducts')
+                : t('website.specialItems.pickSubtitle')}
+            </p>
           </div>
           <button
             type="button"
@@ -183,15 +210,27 @@ export function PickStoreSpecialItemsModal({
           {error && <p className={styles.error}>{error}</p>}
 
           {isLoading ? (
-            <p className={styles.empty}>{t('website.specialItems.pickLoading')}</p>
+            <p className={styles.empty}>
+              {fromProducts
+                ? t('website.specialItems.pickLoadingProducts')
+                : t('website.specialItems.pickLoading')}
+            </p>
           ) : options.length === 0 ? (
-            <p className={styles.empty}>{t('website.specialItems.pickEmpty')}</p>
+            <p className={styles.empty}>
+              {fromProducts
+                ? t('website.specialItems.pickEmptyProducts')
+                : t('website.specialItems.pickEmpty')}
+            </p>
           ) : (
             <StoreItemMultiSearchSelect
               options={options}
               selectedIds={selectedIds}
               onToggle={toggleSelection}
-              placeholder={t('website.specialItems.pickSearch')}
+              placeholder={
+                fromProducts
+                  ? t('website.specialItems.pickSearchProducts')
+                  : t('website.specialItems.pickSearch')
+              }
               disabled={isSubmitting}
               onOpenChange={setSelectOpen}
             />
@@ -212,8 +251,7 @@ export function PickStoreSpecialItemsModal({
           </div>
         </div>
       </div>
-    </div>
-  ,
-  document.body,
+    </div>,
+    document.body,
   )
 }