From 95809851fb2e008f4ca69bb08c637862f9935814 Mon Sep 17 00:00:00 2001
From: HotelSync <admin@hotelsync.ru>
Date: Mon, 23 Mar 2026 13:05:08 +0300
Subject: [PATCH] fix: correct token read in upload + remove upload button,
 keep drop zone
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- api.upload.photo used wrong localStorage key ('access_token' vs 'hotelsync-session')
- Removed standalone 'Загрузить фото' button — drop zone handles click+drag
- Added '+' thumbnail button to add more photos when gallery is non-empty
- Show spinner inline during upload instead of disabled button

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
---
 src/lib/api.ts                   |  2 +-
 src/pages/RoomCategoriesPage.tsx | 16 ++++++++++++----
 2 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/src/lib/api.ts b/src/lib/api.ts
index 4e8390b..563b56f 100644
--- a/src/lib/api.ts
+++ b/src/lib/api.ts
@@ -347,7 +347,7 @@ export const api = {
   // ── File Upload ───────────────────────────────────────────────────────────
   upload: {
     photo: async (file: File, folder: 'categories' | 'rooms' | 'hotels' | 'guests' = 'rooms'): Promise<string> => {
-      const token = localStorage.getItem('access_token')
+      const token = getToken()
       const fd = new FormData()
       fd.append('file', file)
       const res = await fetch(`${BASE}/api/upload?folder=${folder}`, {
diff --git a/src/pages/RoomCategoriesPage.tsx b/src/pages/RoomCategoriesPage.tsx
index a2ca48f..dc0556c 100644
--- a/src/pages/RoomCategoriesPage.tsx
+++ b/src/pages/RoomCategoriesPage.tsx
@@ -250,6 +250,12 @@ function CategoryForm({ category, onClose, onSave }: CategoryFormProps) {
                         <img src={p} alt="" className="w-full h-full object-cover" />
                       </button>
                     ))}
+                    <button
+                      onClick={() => fileRef.current?.click()}
+                      className="w-14 h-14 rounded-lg border-2 border-dashed border-slate-300 dark:border-slate-600 flex items-center justify-center text-slate-400 hover:border-brand-400 hover:text-brand-500 shrink-0 transition-colors"
+                    >
+                      <Plus size={18} />
+                    </button>
                   </div>
                 </div>
               ) : (
@@ -271,10 +277,12 @@ function CategoryForm({ category, onClose, onSave }: CategoryFormProps) {
                 </div>
               )}
               <input ref={fileRef} type="file" accept="image/*" multiple className="hidden" onChange={handlePhotoUpload} />
-              <button onClick={() => fileRef.current?.click()} className="btn-secondary w-full justify-center" disabled={uploading}>
-                {uploading ? <Loader2 size={14} className="animate-spin" /> : <ImagePlus size={14} />}
-                {uploading ? 'Загрузка...' : 'Загрузить фото'}
-              </button>
+              {uploading && (
+                <div className="flex items-center justify-center gap-2 text-sm text-slate-500 py-1">
+                  <Loader2 size={14} className="animate-spin" />
+                  Загрузка...
+                </div>
+              )}
             </>
           )}
         </div>