Upload folder using huggingface_hub

client/src/pages/TutorialTasks.tsx

@@ -119,6 +119,9 @@ const TutorialTasks: React.FC = () => {
   };
 
   // Minimal, local scroll-stability helpers for submit/delete
+  // Basic UA check; Chrome on iOS uses WKWebView but includes 'CriOS'
+  const isSafari = typeof navigator !== 'undefined' && /Safari\//.test(navigator.userAgent) && !/Chrome\//.test(navigator.userAgent) && !/CriOS\//.test(navigator.userAgent);
+
   const lockListHeight = () => {
     const el = listRef.current;
     if (!el) return;
@@ -849,19 +852,20 @@ const TutorialTasks: React.FC = () => {
         const created = response.data;
         console.log('Submission created successfully:', created);
 
-        // Optimistic append to avoid large reflow from full refetch
-        setUserSubmissions(prev => {
-          const current = prev[taskId] || [];
-          // Put newest first like server returns
-          const next = [{ ...created, isOwner: true }, ...current];
-          return { ...prev, [taskId]: next };
-        });
+        // Optimistic append (disabled on Safari to prevent multi-phase jumps)
+        if (!isSafari) {
+          setUserSubmissions(prev => {
+            const current = prev[taskId] || [];
+            const next = [{ ...created, isOwner: true }, ...current];
+            return { ...prev, [taskId]: next };
+          });
+        }
 
         // Defer state updates and minimal refetch
         // Measure grid height and set spacer before refetch to keep layout height constant
         const gridEl = submissionsGridRefs.current[taskId];
         const gridHeight = gridEl ? gridEl.getBoundingClientRect().height : 0;
-        if (gridHeight > 0) setSpacerHeights(prev => ({ ...prev, [taskId]: gridHeight }));
+        if (!isSafari && gridHeight > 0) setSpacerHeights(prev => ({ ...prev, [taskId]: gridHeight }));
         withPreservedCardOffset(taskId, () => {
           React.startTransition(() => {
             setTranslationText({ ...translationText, [taskId]: '' });
@@ -870,8 +874,9 @@ const TutorialTasks: React.FC = () => {
             api.get(`/api/submissions/by-source/${taskId}`).then(r => {
               const list = (r.data && r.data.submissions) || [];
               setUserSubmissions(prev => ({ ...prev, [taskId]: list }));
-              // Release spacer one frame after list update to avoid jump
-              requestAnimationFrame(() => setSpacerHeights(prev => ({ ...prev, [taskId]: 0 })));
+              if (!isSafari) {
+                requestAnimationFrame(() => setSpacerHeights(prev => ({ ...prev, [taskId]: 0 })));
+              }
             }).catch(() => {
               requestAnimationFrame(() => setSpacerHeights(prev => ({ ...prev, [taskId]: 0 })));
             });
@@ -945,8 +950,8 @@ const TutorialTasks: React.FC = () => {
 
       if (response.status === 200) {
   
-        // Optimistically remove from local submissions to avoid large reflow
-        if (taskId) {
+        // Optimistic removal (disabled on Safari to prevent multi-phase jumps)
+        if (taskId && !isSafari) {
           setUserSubmissions(prev => {
             const list = prev[taskId] || [];
             const next = list.filter(s => s._id !== submissionId);
@@ -962,11 +967,13 @@ const TutorialTasks: React.FC = () => {
             if (taskId) {
               const gridEl = submissionsGridRefs.current[taskId];
               const gridHeight = gridEl ? gridEl.getBoundingClientRect().height : 0;
-              if (gridHeight > 0) setSpacerHeights(prev => ({ ...prev, [taskId]: gridHeight }));
+              if (!isSafari && gridHeight > 0) setSpacerHeights(prev => ({ ...prev, [taskId]: gridHeight }));
               api.get(`/api/submissions/by-source/${taskId}`).then(r => {
                 const list = (r.data && r.data.submissions) || [];
                 setUserSubmissions(prev => ({ ...prev, [taskId]: list }));
-                requestAnimationFrame(() => setSpacerHeights(prev => ({ ...prev, [taskId]: 0 })));
+                if (!isSafari) {
+                  requestAnimationFrame(() => setSpacerHeights(prev => ({ ...prev, [taskId]: 0 })));
+                }
               }).catch(() => {
                 requestAnimationFrame(() => setSpacerHeights(prev => ({ ...prev, [taskId]: 0 })));
               });