@kyro-cms/admin 0.10.18 → 0.10.20

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kyro-cms/admin",
-  "version": "0.10.18",
+  "version": "0.10.20",
   "engines": {
     "node": ">=22"
   },

package/src/components/GraphQLPlayground.tsx

@@ -393,11 +393,19 @@ export function GraphQLPlayground({
   const [token, setToken] = useState<string>("");
   const [showToken, setShowToken] = useState(false);
   const [isConnected, setIsConnected] = useState(false);
-  const [tab, setTab] = useState<QueryTab>({
-    id: "default",
-    query: initialQuery || DEFAULT_QUERY,
-    variables: initialVariables || "{}",
-    headers: "",
+  const [tab, setTab] = useState<QueryTab>(() => {
+    if (typeof window !== "undefined") {
+      try {
+        const saved = localStorage.getItem("kyro_graphql_tab");
+        if (saved) return JSON.parse(saved);
+      } catch {}
+    }
+    return {
+      id: "default",
+      query: initialQuery || DEFAULT_QUERY,
+      variables: initialVariables || "{}",
+      headers: "",
+    };
   });
   const [response, setResponse] = useState<string>("");
   const [isLoading, setIsLoading] = useState(false);
@@ -411,7 +419,15 @@ export function GraphQLPlayground({
   const [rightTab, setRightTab] = useState<"response" | "docs" | "history">(
     initialShowDocs ? "docs" : "response",
   );
-  const [history, setHistory] = useState<HistoryEntry[]>([]);
+  const [history, setHistory] = useState<HistoryEntry[]>(() => {
+    if (typeof window !== "undefined") {
+      try {
+        const saved = localStorage.getItem("kyro_graphql_history");
+        if (saved) return JSON.parse(saved);
+      } catch {}
+    }
+    return [];
+  });
   const [lastDuration, setLastDuration] = useState<number>(0);
   const [lastStatus, setLastStatus] = useState<number>(0);
   const [copied, setCopied] = useState(false);
@@ -426,6 +442,18 @@ export function GraphQLPlayground({
     setIsMounted(true);
   }, []);
 
+  useEffect(() => {
+    if (isMounted) {
+      localStorage.setItem("kyro_graphql_tab", JSON.stringify(tab));
+    }
+  }, [tab, isMounted]);
+
+  useEffect(() => {
+    if (isMounted) {
+      localStorage.setItem("kyro_graphql_history", JSON.stringify(history));
+    }
+  }, [history, isMounted]);
+
   useEffect(() => {
     const check = () => setIsDesktop(window.innerWidth >= 768);
     check();

package/src/components/RestPlayground.tsx

@@ -83,13 +83,21 @@ export function RestPlayground({ collections = [] }: RestPlaygroundProps) {
   const [history, setHistory] = useState<HistoryItem[]>([]);
   const [envVars, setEnvVars] = useState<EnvVariable[]>([]);
   const [selectedRequest, setSelectedRequest] = useState<SavedRequest | null>(null);
-  const [currentRequest, setCurrentRequest] = useState<SavedRequest>({
-    id: "new",
-    name: "Untitled Request",
-    method: "GET",
-    url: "",
-    headers: {},
-    body: "",
+  const [currentRequest, setCurrentRequest] = useState<SavedRequest>(() => {
+    if (typeof window !== "undefined") {
+      try {
+        const saved = localStorage.getItem("kyro_rest_current");
+        if (saved) return JSON.parse(saved);
+      } catch {}
+    }
+    return {
+      id: "new",
+      name: "Untitled Request",
+      method: "GET",
+      url: "",
+      headers: {},
+      body: "",
+    };
   });
   const [response, setResponse] = useState<{ status: number; duration: number; size: number; data: any } | null>(null);
   const [loading, setLoading] = useState(false);
@@ -136,6 +144,10 @@ export function RestPlayground({ collections = [] }: RestPlaygroundProps) {
     if (isMounted) localStorage.setItem(STORAGE_KEYS.env, JSON.stringify(envVars));
   }, [envVars, isMounted]);
 
+  useEffect(() => {
+    if (isMounted) localStorage.setItem("kyro_rest_current", JSON.stringify(currentRequest));
+  }, [currentRequest, isMounted]);
+
   const resolveUrl = (url: string) => {
     let resolved = url;
     envVars.forEach((v) => {

package/src/components/fields/BlocksField.tsx

@@ -225,18 +225,12 @@ const SortableBlockComponent = ({
   }
 
   return (
-    <div ref={setNodeRef} style={style} className="relative group md:pl-8 mb-2">
+    <div ref={setNodeRef} style={style} className="relative group mb-2">
       <div
-        className="hidden md:absolute left-0 top-1/2 -translate-y-1/2 p-1.5 cursor-grab active:cursor-grabbing text-[var(--kyro-text-muted)] opacity-0 group-hover:opacity-100 transition-opacity hover:bg-[var(--kyro-surface-accent)] rounded"
         {...attributes}
         {...listeners}
-      >
-        <GripVertical className="w-4 h-4" />
-      </div>
-
-      <div
         onClick={() => setEditingBlockId(block.id as string)}
-        className={`flex items-center gap-3 p-3 bg-[var(--kyro-bg-secondary)] rounded-lg border transition-colors cursor-pointer ${isEditing
+        className={`flex items-center gap-3 p-3 bg-[var(--kyro-bg-secondary)] rounded-lg border transition-colors cursor-grab active:cursor-grabbing ${isEditing
             ? `${(blockTheme[block.type as string] || blockTheme.default).border} bg-[var(--kyro-primary)]/5`
             : "border-[var(--kyro-border)] hover:border-[var(--kyro-primary)]/50 hover:bg-[var(--kyro-primary)]/5"
           }`}
@@ -543,7 +537,8 @@ export const BlocksField: React.FC<BlocksFieldProps> = ({
   const sensors = useSensors(
     useSensor(PointerSensor, {
       activationConstraint: {
-        distance: 8,
+        delay: 200,
+        tolerance: 5,
       },
     }),
     useSensor(KeyboardSensor),