🆙 Fix Catalog Edit

src/components/catalog/views/admin/CatalogAdminPageEditView.tsx

@@ -15,8 +15,9 @@ const LAYOUT_OPTIONS = [
 ];
 
 const MODE_OPTIONS = [
-    { value: CatalogType.NORMAL, label: 'Normale' },
-    { value: 'BOTH', label: 'Entrambi' }
+    { value: 'NORMAL', label: 'Normal' },
+    { value: 'BUILDER', label: 'Builder' },
+    { value: 'BOTH', label: 'Both' }
 ];
 
 export const CatalogAdminPageEditView: FC<{}> = () =>
@@ -30,17 +31,15 @@ export const CatalogAdminPageEditView: FC<{}> = () =>
     const loading = catalogAdmin?.loading ?? false;
 
     const [ caption, setCaption ] = useState('');
-    const [ catalogMode, setCatalogMode ] = useState(CatalogType.NORMAL);
+    const [ captionSave, setCaptionSave ] = useState('');
+    const [ catalogMode, setCatalogMode ] = useState<string>('NORMAL');
     const [ pageLayout, setPageLayout ] = useState('default_3x3');
+    const [ iconImage, setIconImage ] = useState(0);
     const [ minRank, setMinRank ] = useState(1);
     const [ visible, setVisible ] = useState('1');
     const [ enabled, setEnabled ] = useState('1');
     const [ orderNum, setOrderNum ] = useState(0);
-
-    // Resolve what we're editing:
-    // 1. editingPageNode (explicit node from sidebar click)
-    // 2. editingRootPage (root button)
-    // 3. current active page (from "Modifica Pagina" in layout)
+    const [ parentId, setParentId ] = useState(-1);
     const targetNode = editingPageNode
         ? editingPageNode
         : editingRootPage
@@ -62,12 +61,18 @@ export const CatalogAdminPageEditView: FC<{}> = () =>
         if(!editingPageData || !targetNode) return;
 
         setCaption(targetNode.localization || '');
-        setCatalogMode(currentType === CatalogType.BUILDER ? CatalogType.BUILDER : (currentType || CatalogType.NORMAL));
+        setCaptionSave(targetNode.pageName || targetNode.localization || '');
+        setCatalogMode(currentType === CatalogType.BUILDER ? 'BUILDER' : 'NORMAL');
         setPageLayout(currentPage?.layoutCode || 'default_3x3');
+        setIconImage(targetNode.iconId ?? 0);
         setVisible(targetNode.isVisible ? '1' : '0');
         setEnabled('1');
         setMinRank(1);
         setOrderNum(0);
+        const wireParentId = targetNode.parentId;
+        setParentId(typeof wireParentId === 'number' && wireParentId !== -1
+            ? wireParentId
+            : (targetNode.parent ? targetNode.parent.pageId : -1));
     }, [ editingPageData, targetNode, currentPage, currentType ]);
 
     if(!editingPageData || !targetNode) return null;
@@ -78,18 +83,18 @@ export const CatalogAdminPageEditView: FC<{}> = () =>
     {
         if(!catalogAdmin?.savePage) return;
 
-        const parentNode = targetNode.parent;
-
         const data: IPageEditData = {
             pageId: targetPageId,
             caption,
+            captionSave,
             catalogMode,
             pageLayout,
+            iconImage,
             minRank,
             visible,
             enabled,
             orderNum,
-            parentId: parentNode ? parentNode.pageId : -1,
+            parentId,
         };
 
         catalogAdmin.savePage(data);
@@ -111,7 +116,7 @@ export const CatalogAdminPageEditView: FC<{}> = () =>
         <div className="bg-white rounded border-2 border-card-grid-item-border p-2.5 mb-2">
             <div className="flex items-center justify-between mb-2">
                 <span className="text-[11px] font-bold text-primary uppercase tracking-wide">
-                    { isRoot ? LocalizeText('catalog.admin.edit.root') : `${ LocalizeText('catalog.admin.edit') } ${ targetNode.localization } (#${ targetPageId })` }
+                    { isRoot ? LocalizeText('catalog.admin.edit.root') : `${ LocalizeText('catalog.admin.edit') } ${ targetNode.localization }` }
                 </span>
                 <FaTimes className="text-muted cursor-pointer hover:text-danger text-[10px]" onClick={ closeForm } />
             </div>
@@ -125,13 +130,19 @@ export const CatalogAdminPageEditView: FC<{}> = () =>
                     <label className="text-[9px] text-muted uppercase font-bold">Min Rank</label>
                     <input className={ inputClass } min={ 1 } type="number" value={ minRank } onChange={ e => setMinRank(parseInt(e.target.value) || 1) } />
                 </div>
+                <div className="flex flex-col gap-0.5 col-span-2">
+                    <label className="text-[9px] text-muted uppercase font-bold">Caption Save (Localisation Key)</label>
+                    <input className={ inputClass } value={ captionSave } onChange={ e => setCaptionSave(e.target.value) } />
+                </div>
+                <div className="flex flex-col gap-0.5">
+                    <label className="text-[9px] text-muted uppercase font-bold">Icon Image</label>
+                    <input className={ inputClass } min={ 0 } type="number" value={ iconImage } onChange={ e => setIconImage(parseInt(e.target.value) || 0) } />
+                </div>
                 <div className="flex flex-col gap-0.5">
                     <label className="text-[9px] text-muted uppercase font-bold">Mode</label>
-                    { currentType === CatalogType.BUILDER
-                        ? <div className={ `${ inputClass } flex items-center min-h-[28px] bg-gray-100 text-muted` }>Builders Club</div>
-                        : <select className={ inputClass } value={ catalogMode } onChange={ e => setCatalogMode(e.target.value) }>
-                            { MODE_OPTIONS.map(option => <option key={ option.value } value={ option.value }>{ option.label }</option>) }
-                        </select> }
+                    <select className={ inputClass } value={ catalogMode } onChange={ e => setCatalogMode(e.target.value) }>
+                        { MODE_OPTIONS.map(option => <option key={ option.value } value={ option.value }>{ option.label }</option>) }
+                    </select>
                 </div>
                 <div className="flex flex-col gap-0.5">
                     <label className="text-[9px] text-muted uppercase font-bold">Layout</label>
@@ -143,6 +154,10 @@ export const CatalogAdminPageEditView: FC<{}> = () =>
                     <label className="text-[9px] text-muted uppercase font-bold">{ LocalizeText('catalog.admin.order') }</label>
                     <input className={ inputClass } min={ 0 } type="number" value={ orderNum } onChange={ e => setOrderNum(parseInt(e.target.value) || 0) } />
                 </div>
+                <div className="flex flex-col gap-0.5">
+                    <label className="text-[9px] text-muted uppercase font-bold">Parent ID</label>
+                    <input className={ inputClass } disabled={ isRoot } type="number" value={ parentId } onChange={ e => setParentId(parseInt(e.target.value) || -1) } />
+                </div>
                 <div className="flex items-end gap-2 pb-0.5">
                     <label className="flex items-center gap-1 text-[10px] cursor-pointer">
                         <input className="accent-primary" checked={ visible === '1' } type="checkbox" onChange={ e => setVisible(e.target.checked ? '1' : '0') } />

src/components/catalog/views/navigation/CatalogNavigationItemView.tsx

@@ -101,8 +101,10 @@ export const CatalogNavigationItemView: FC<CatalogNavigationItemViewProps> = pro
                                 e.stopPropagation();
                                 catalogAdmin.createPage({
                                     caption: 'New Page',
+                                    captionSave: 'New Page',
                                     catalogMode: currentType,
                                     pageLayout: 'default_3x3',
+                                    iconImage: 0,
                                     minRank: 1,
                                     visible: '1',
                                     enabled: '1',

src/components/catalog/views/page/layout/CatalogLayoutVipBuyView.tsx

@@ -25,6 +25,7 @@ export const CatalogLayoutVipBuyView: FC<CatalogLayoutProps> = props =>
     const giftSuccessTimerRef = useRef<ReturnType<typeof setTimeout> | null>(null);
 
     const isSelfGift = giftMode && !!ownUserName && giftRecipient.trim().toLowerCase() === ownUserName.toLowerCase();
+
     const onCatalogEvent = useCallback((event: CatalogEvent) =>
     {
         switch(event.type)
@@ -148,7 +149,6 @@ export const CatalogLayoutVipBuyView: FC<CatalogLayoutProps> = props =>
         setPendingOffer(offer);
         setGiftError(null);
         setGiftSuccess(false);
-
         if(!offer?.giftable) setGiftMode(false);
     }, []);