Polish business FA layout and wire special-group keys plus SSL sync.

RTL carousels/FABs, special key+title fields, slider gallery fixes, and dashboard SSL sync agent for super-admin.

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

apps/business/src/components/CreateStoreItemsModal.tsx

@@ -1,6 +1,8 @@
 import { useEffect, useMemo, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { Plus, 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 {
@@ -40,6 +42,8 @@ export function CreateStoreItemsModal({
   onCreated,
   onEditExisting,
 }: CreateStoreItemsModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
   const [products, setProducts] = useState<{ id: string; title: string; nameFa: string }[]>([])
@@ -118,7 +122,7 @@ export function CreateStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load products.')
+        setError(t('storeItems.create.errorProducts'))
       }
     } finally {
       setIsLoadingProducts(false)
@@ -138,7 +142,7 @@ export function CreateStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to load product variations.')
+        setError(t('storeItems.create.errorVariations'))
       }
       setVariations([])
       setRows([])
@@ -235,7 +239,7 @@ export function CreateStoreItemsModal({
       if (err instanceof ApiError) {
         setError(err.message)
       } else {
-        setError('Unable to create store items.')
+        setError(t('storeItems.create.errorCreate'))
       }
     } finally {
       setIsSubmitting(false)
@@ -253,36 +257,40 @@ export function CreateStoreItemsModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="create-store-items-title"
+        lang={locale === 'fa' ? 'fa' : 'en'}
+        dir={locale === 'fa' ? 'rtl' : 'ltr'}
       >
         <div className={modalStyles.header}>
           <div>
             <h3 id="create-store-items-title" className={modalStyles.title}>
-              Add Store Items
+              {t('storeItems.create.title')}
             </h3>
-            <p className={modalStyles.subtitle}>
-              Create sellable variants from a product&apos;s variations.
-            </p>
+            <p className={modalStyles.subtitle}>{t('storeItems.create.subtitle')}</p>
           </div>
-          <button className={modalStyles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            className={modalStyles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form className={modalStyles.body} onSubmit={(e) => void handleSubmit(e)}>
           <div className={modalStyles.field}>
-            <label htmlFor="store-item-product">Product</label>
             <ProductSearchSelect
               id="store-item-product"
               options={products}
               value={productId}
               onChange={handleProductChange}
-              placeholder="Type 3+ characters to search products"
+              placeholder={t('storeItems.create.productPlaceholder')}
               disabled={isLoadingProducts || isSubmitting}
+              aria-label={t('storeItems.create.productPlaceholder')}
             />
           </div>
 
           {productId && isLoadingVariations && (
-            <p className={modalStyles.emptyText}>Loading product variations...</p>
+            <p className={modalStyles.emptyText}>{t('storeItems.create.loadingVariations')}</p>
           )}
 
           {productId && !isLoadingVariations && (
@@ -294,8 +302,8 @@ export function CreateStoreItemsModal({
                 {formVariations.map((variation) => (
                   <span key={variation.id}>{variation.name}</span>
                 ))}
-                <span>Price (IRT)</span>
-                <span>Stock</span>
+                <span>{t('storeItems.create.price')}</span>
+                <span>{t('storeItems.create.stock')}</span>
                 <span />
               </div>
 
@@ -346,13 +354,13 @@ export function CreateStoreItemsModal({
                       disabled={isSubmitting}
                     />
                     <div className={rowStyles.removeCell}>
-                      <Tooltip label="Remove row">
+                      <Tooltip label={t('storeItems.create.removeRow')}>
                         <button
                           type="button"
                           className={modalStyles.removeRowBtn}
                           onClick={() => removeRow(row.id)}
                           disabled={rows.length <= 1 || isSubmitting}
-                          aria-label="Remove row"
+                          aria-label={t('storeItems.create.removeRow')}
                         >
                           <X size={16} />
                         </button>
@@ -369,7 +377,7 @@ export function CreateStoreItemsModal({
                 disabled={isSubmitting}
               >
                 <Plus size={16} />
-                Add row
+                {t('storeItems.create.addRow')}
               </button>
             </>
           )}
@@ -383,14 +391,16 @@ export function CreateStoreItemsModal({
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('storeItems.create.cancel')}
             </button>
             <button
               type="submit"
               className={modalStyles.submitBtn}
               disabled={!canSubmit}
             >
-              {isSubmitting ? 'Creating…' : 'Create store items'}
+              {isSubmitting
+                ? t('storeItems.create.submitting')
+                : t('storeItems.create.submit')}
             </button>
           </div>
         </form>