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/BrandModal.tsx

@@ -1,6 +1,8 @@
 import { useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { X } from 'lucide-react'
+import { useLocale } from '@meshkee/dashboard-ui'
+import { useT } from '../i18n/useT'
 import { ImageCropper } from './ImageCropper'
 import type { Brand, BrandFormData } from '../types/brand'
 import styles from './BrandModal.module.css'
@@ -21,9 +23,12 @@ export function BrandModal({
   onClose,
   onSubmit,
   editingBrand = null,
-  title = 'Add Brand',
+  title,
   isSubmitting = false,
 }: BrandModalProps) {
+  const t = useT()
+  const { locale } = useLocale()
+  const isFa = locale === 'fa'
   const formRef = useRef<HTMLFormElement>(null)
   const [mounted, setMounted] = useState(open)
   const [closing, setClosing] = useState(false)
@@ -85,39 +90,46 @@ export function BrandModal({
         role="dialog"
         aria-modal="true"
         aria-labelledby="brand-modal-title"
+        lang={isFa ? 'fa' : 'en'}
+        dir={isFa ? 'rtl' : 'ltr'}
       >
         <div className={styles.header}>
           <h3 id="brand-modal-title" className={styles.title}>
-            {title}
+            {title ?? t('brands.add')}
           </h3>
-          <button className={styles.closeBtn} onClick={onClose} aria-label="Close">
+          <button
+            type="button"
+            className={styles.closeBtn}
+            onClick={onClose}
+            aria-label={t('common.close')}
+          >
             <X size={20} />
           </button>
         </div>
 
         <form ref={formRef} className={styles.form} onSubmit={handleSubmit}>
           <div className={styles.field}>
-            <label>Brand logo</label>
+            <label>{t('brands.modal.logo')}</label>
             <ImageCropper
               value={image}
               onChange={setImage}
               outputFormat="png"
               accept="image/png"
-              uploadLabel="Upload brand logo"
-              hint="PNG only — transparent background recommended"
-              changeLabel="Change logo"
+              uploadLabel={t('brands.modal.uploadLogo')}
+              hint={t('brands.modal.logoHint')}
+              changeLabel={t('brands.modal.changeLogo')}
             />
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="nameFa">Name (FA)</label>
+            <label htmlFor="nameFa">{t('brands.modal.nameFa')}</label>
             <input
               id="nameFa"
               name="nameFa"
               type="text"
               dir="rtl"
               className="faText"
-              placeholder="نام برند"
+              placeholder={t('brands.modal.nameFaPlaceholder')}
               value={nameFa}
               onChange={(e) => setNameFa(e.target.value)}
               disabled={isSubmitting}
@@ -125,13 +137,13 @@ export function BrandModal({
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="nameEn">Name (EN)</label>
+            <label htmlFor="nameEn">{t('brands.modal.nameEn')}</label>
             <input
               id="nameEn"
               name="nameEn"
               type="text"
-              dir="ltr"
-              placeholder="Brand name"
+              dir={isFa ? 'rtl' : 'ltr'}
+              placeholder={t('brands.modal.nameEnPlaceholder')}
               value={nameEn}
               onChange={(e) => setNameEn(e.target.value)}
               required
@@ -140,12 +152,13 @@ export function BrandModal({
           </div>
 
           <div className={styles.field}>
-            <label htmlFor="about">About</label>
+            <label htmlFor="about">{t('brands.modal.about')}</label>
             <textarea
               id="about"
               name="about"
               rows={3}
-              placeholder="Short description of this brand"
+              dir={isFa ? 'rtl' : 'ltr'}
+              placeholder={t('brands.modal.aboutPlaceholder')}
               value={about}
               onChange={(e) => setAbout(e.target.value)}
               disabled={isSubmitting}
@@ -159,10 +172,10 @@ export function BrandModal({
               onClick={onClose}
               disabled={isSubmitting}
             >
-              Cancel
+              {t('brands.modal.cancel')}
             </button>
             <button type="submit" className={styles.submitBtn} disabled={isSubmitting}>
-              {isSubmitting ? 'Saving...' : 'Save Brand'}
+              {isSubmitting ? t('brands.modal.saving') : t('brands.modal.save')}
             </button>
           </div>
         </form>