@rozenite/storage-plugin 2.0.0 → 2.2.0

package/src/ui/__tests__/use-storage-entries.test.tsx

@@ -97,11 +97,8 @@ describe('storage entry query hooks', () => {
       if (payload.cursor === undefined)
         return Promise.resolve(response(undefined, { next: 'next' }));
       if (payload.cursor === 'next')
-        return Promise.resolve(
-          response('next', { next: 'last', previous: 'first' }),
-        );
-      if (payload.cursor === 'last')
-        return Promise.resolve(response('last', { previous: 'next' }));
+        return Promise.resolve(response('next', { next: 'last', previous: 'first' }));
+      if (payload.cursor === 'last') return Promise.resolve(response('last', { previous: 'next' }));
       return Promise.resolve(response('first', { next: 'next' }));
     });
     const hook = await renderPreviewHook({
@@ -117,9 +114,11 @@ describe('storage entry query hooks', () => {
     });
     await act(async () => hook.result.fetchNextPage());
     await act(async () => hook.result.fetchNextPage());
-    expect(
-      request.mock.calls.map(([options]) => options.payload.cursor),
-    ).toEqual([undefined, 'next', 'last']);
+    expect(request.mock.calls.map(([options]) => options.payload.cursor)).toEqual([
+      undefined,
+      'next',
+      'last',
+    ]);
     const queryKey = storageEntryPreviewQueryKey(target, '', 'ascending');
     const pageKeys = () =>
       hook.queryClient
@@ -134,9 +133,7 @@ describe('storage entry query hooks', () => {
 
   it('cancels stale target requests and starts a new sequence at the first page', async () => {
     globalThis.IS_REACT_ACT_ENVIRONMENT = true;
-    let resolveFirst:
-      | ((value: ReturnType<typeof response>) => void)
-      | undefined;
+    let resolveFirst: ((value: ReturnType<typeof response>) => void) | undefined;
     const request = vi.fn(({ payload }) => {
       if (payload.target === target) {
         return new Promise((resolve) => {
@@ -171,8 +168,7 @@ describe('storage entry query hooks', () => {
       expect(
         hook.queryClient.getQueryData<{
           pages: Array<ReturnType<typeof response>>;
-        }>(storageEntryPreviewQueryKey(otherTarget, 'two', 'descending'))
-          ?.pages[0].target,
+        }>(storageEntryPreviewQueryKey(otherTarget, 'two', 'descending'))?.pages[0].target,
       ).toEqual(otherTarget),
     );
     await hook.unmount();
@@ -243,9 +239,7 @@ describe('storage entry query hooks', () => {
 
   it('resets every selected-storage preview variant but refetches only the active first page', async () => {
     globalThis.IS_REACT_ACT_ENVIRONMENT = true;
-    const request = vi.fn(({ payload }) =>
-      Promise.resolve(response(payload.cursor)),
-    );
+    const request = vi.fn(({ payload }) => Promise.resolve(response(payload.cursor)));
     const hook = await renderPreviewHook({
       client: asClient(request),
       target,
@@ -255,28 +249,22 @@ describe('storage entry query hooks', () => {
     await act(async () => {
       await vi.waitFor(() => expect(hook.result.isSuccess).toBe(true));
     });
-    hook.queryClient.setQueryData(
-      storageEntryPreviewQueryKey(target, 'inactive', 'ascending'),
-      { pages: [response(undefined)], pageParams: [undefined] },
-    );
+    hook.queryClient.setQueryData(storageEntryPreviewQueryKey(target, 'inactive', 'ascending'), {
+      pages: [response(undefined)],
+      pageParams: [undefined],
+    });
 
-    await act(async () =>
-      resetSelectedStorageQueries(hook.queryClient, target),
-    );
+    await act(async () => resetSelectedStorageQueries(hook.queryClient, target));
     expect(request).toHaveBeenCalledTimes(2);
     expect(
-      hook.queryClient.getQueryData(
-        storageEntryPreviewQueryKey(target, 'inactive', 'ascending'),
-      ),
+      hook.queryClient.getQueryData(storageEntryPreviewQueryKey(target, 'inactive', 'ascending')),
     ).toBeUndefined();
     await hook.unmount();
   });
 
   it('invalidates only the changed storage preview prefix and drops its stale full value', async () => {
     globalThis.IS_REACT_ACT_ENVIRONMENT = true;
-    const request = vi.fn(({ payload }) =>
-      Promise.resolve(response(payload.cursor)),
-    );
+    const request = vi.fn(({ payload }) => Promise.resolve(response(payload.cursor)));
     const hook = await renderPreviewHook({
       client: asClient(request),
       target,
@@ -286,11 +274,7 @@ describe('storage entry query hooks', () => {
     await act(async () => {
       await vi.waitFor(() => expect(hook.result.isSuccess).toBe(true));
     });
-    const otherQueryKey = storageEntryPreviewQueryKey(
-      otherTarget,
-      'other',
-      'ascending',
-    );
+    const otherQueryKey = storageEntryPreviewQueryKey(otherTarget, 'other', 'ascending');
     hook.queryClient.setQueryDefaults(otherQueryKey, { gcTime: Infinity });
     hook.queryClient.setQueryData(otherQueryKey, {
       pages: [response(undefined)],

package/src/ui/add-entry-dialog.tsx

@@ -1,10 +1,6 @@
-import { Button, ConfirmDialog, Dialog, Field, Input } from '@rozenite/ui';
+import { Button, Dialog, Field, Input, useConfirmDialog } from '@rozenite/ui';
 import { useEffect, useState } from 'react';
-import type {
-  StorageEntry,
-  StorageEntryType,
-  StorageEntryValue,
-} from '../shared/types';
+import type { StorageEntry, StorageEntryType, StorageEntryValue } from '../shared/types';
 import { TypedValueEditor } from './typed-value-editor';
 import { defaultValueForType } from './type-conversion';
 
@@ -49,9 +45,7 @@ export const AddEntryDialog = ({
   const [currentValue, setCurrentValue] = useState<StorageEntryValue | null>(
     defaultValueForType(initialType),
   );
-  const [alert, setAlert] = useState<{ title: string; message: string } | null>(
-    null,
-  );
+  const confirm = useConfirmDialog();
 
   // Reset state every time the dialog opens, so a previous session's
   // type / value doesn't bleed in.
@@ -72,21 +66,23 @@ export const AddEntryDialog = ({
     onClose();
   };
 
-  const handleAdd = () => {
+  const handleAdd = async () => {
     if (!newEntryKey.trim() || currentValue === null) return;
 
     if (!isCurrentTypeSupported) {
-      setAlert({
+      await confirm({
+        variant: 'alert',
         title: 'Unsupported Type',
-        message: 'Selected type is not supported by this storage.',
+        description: 'Selected type is not supported by this storage.',
       });
       return;
     }
 
     if (existingKeys.includes(newEntryKey)) {
-      setAlert({
+      await confirm({
+        variant: 'alert',
         title: 'Key Already Exists',
-        message: 'An entry with this key already exists.',
+        description: 'An entry with this key already exists.',
       });
       return;
     }
@@ -96,85 +92,68 @@ export const AddEntryDialog = ({
   };
 
   const handleKeyDown = (event: React.KeyboardEvent) => {
-    if (
-      event.key === 'Enter' &&
-      newEntryKey.trim() &&
-      currentType !== 'buffer'
-    ) {
-      handleAdd();
+    if (event.key === 'Enter' && newEntryKey.trim() && currentType !== 'buffer') {
+      void handleAdd();
     }
   };
 
   // Unsavable when no key, no supported type, or when the value is
   // null — the hex editor signals invalid / empty hex via null.
-  const isAddDisabled =
-    !newEntryKey.trim() || !isCurrentTypeSupported || currentValue === null;
+  const isAddDisabled = !newEntryKey.trim() || !isCurrentTypeSupported || currentValue === null;
 
   return (
-    <>
-      <Dialog
-        open={isOpen}
-        onOpenChange={(open) => {
-          if (!open) resetAndClose();
-        }}
-      >
-        <Dialog.Content onKeyDown={handleKeyDown}>
-          <Dialog.Header>
-            <Dialog.Title>Add New Entry</Dialog.Title>
-          </Dialog.Header>
-
-          <div className="flex flex-col gap-4">
-            <Field>
-              <Field.Label htmlFor="new-entry-key">Key</Field.Label>
-              <Input
-                id="new-entry-key"
-                value={newEntryKey}
-                onChange={(event) => setNewEntryKey(event.target.value)}
-                placeholder="Enter key name"
-                autoFocus
-              />
-            </Field>
-
-            <Field>
-              <Field.Label htmlFor="new-entry-value">Value</Field.Label>
-              <TypedValueEditor
-                supportedTypes={supportedTypes}
-                type={currentType}
-                value={currentValue}
-                onChange={(nextType, nextValue) => {
-                  setCurrentType(nextType);
-                  setCurrentValue(nextValue);
-                }}
-                inputId="new-entry-value"
-              />
-              {!isCurrentTypeSupported && (
-                <Field.Description className="text-destructive">
-                  Selected type is not supported by this storage.
-                </Field.Description>
-              )}
-            </Field>
-          </div>
-
-          <Dialog.Footer>
-            <Button variant="outline" onClick={resetAndClose}>
-              Cancel
-            </Button>
-            <Button onClick={handleAdd} disabled={isAddDisabled}>
-              Add Entry
-            </Button>
-          </Dialog.Footer>
-        </Dialog.Content>
-      </Dialog>
-
-      <ConfirmDialog
-        open={alert !== null}
-        onOpenChange={(open) => {
-          if (!open) setAlert(null);
-        }}
-        variant="alert"
-        title={alert?.title ?? ''}
-        description={alert?.message}
-      />
-    </>
+    <Dialog
+      open={isOpen}
+      onOpenChange={(open) => {
+        if (!open) resetAndClose();
+      }}
+    >
+      <Dialog.Content onKeyDown={handleKeyDown}>
+        <Dialog.Header>
+          <Dialog.Title>Add New Entry</Dialog.Title>
+        </Dialog.Header>
+
+        <div className="flex flex-col gap-4">
+          <Field>
+            <Field.Label htmlFor="new-entry-key">Key</Field.Label>
+            <Input
+              id="new-entry-key"
+              value={newEntryKey}
+              onChange={(event) => setNewEntryKey(event.target.value)}
+              placeholder="Enter key name"
+              autoFocus
+            />
+          </Field>
+
+          <Field>
+            <Field.Label htmlFor="new-entry-value">Value</Field.Label>
+            <TypedValueEditor
+              supportedTypes={supportedTypes}
+              type={currentType}
+              value={currentValue}
+              onChange={(nextType, nextValue) => {
+                setCurrentType(nextType);
+                setCurrentValue(nextValue);
+              }}
+              inputId="new-entry-value"
+            />
+            {!isCurrentTypeSupported && (
+              <Field.Description className="text-danger">
+                Selected type is not supported by this storage.
+              </Field.Description>
+            )}
+          </Field>
+        </div>
+
+        <Dialog.Footer>
+          <Button tone="neutral" variant="outline" onClick={resetAndClose}>
+            Cancel
+          </Button>
+          <Button onClick={() => void handleAdd()} disabled={isAddDisabled}>
+            Add Entry
+          </Button>
+        </Dialog.Footer>
+      </Dialog.Content>
+    </Dialog>
   );
 };

package/src/ui/binary-value-editor-state.ts

@@ -1,9 +1,4 @@
-import {
-  base64ToBytes,
-  bytesToBase64,
-  bytesToGroupedHex,
-  hexInputToBytes,
-} from './binary';
+import { base64ToBytes, bytesToBase64, bytesToGroupedHex, hexInputToBytes } from './binary';
 
 export type EditorMode = 'hex' | 'base64';
 
@@ -20,9 +15,7 @@ export type EditorAction =
   | { type: 'switch-mode'; mode: EditorMode }
   | { type: 'replace-bytes'; bytes: number[] };
 
-export type Validation =
-  | { ok: true; bytes: number[] }
-  | { ok: false; reason: string };
+export type Validation = { ok: true; bytes: number[] } | { ok: false; reason: string };
 
 const encode = (bytes: readonly number[], mode: EditorMode): string =>
   mode === 'hex' ? bytesToGroupedHex(bytes) : bytesToBase64(bytes);
@@ -30,20 +23,12 @@ const encode = (bytes: readonly number[], mode: EditorMode): string =>
 const parse = (text: string, mode: EditorMode) =>
   mode === 'hex' ? hexInputToBytes(text) : base64ToBytes(text);
 
-const parsedToState = (
-  text: string,
-  mode: EditorMode,
-): Pick<EditorState, 'bytes' | 'error'> => {
+const parsedToState = (text: string, mode: EditorMode): Pick<EditorState, 'bytes' | 'error'> => {
   const result = parse(text, mode);
-  return result.ok
-    ? { bytes: result.value, error: null }
-    : { bytes: null, error: result.error };
+  return result.ok ? { bytes: result.value, error: null } : { bytes: null, error: result.error };
 };
 
-export const initialState = (args: {
-  initialBytes?: number[];
-  mode?: EditorMode;
-}): EditorState => {
+export const initialState = (args: { initialBytes?: number[]; mode?: EditorMode }): EditorState => {
   const mode = args.mode ?? 'hex';
   if (args.initialBytes && args.initialBytes.length > 0) {
     return {
@@ -61,10 +46,7 @@ export const initialState = (args: {
   };
 };
 
-export const reduce = (
-  state: EditorState,
-  action: EditorAction,
-): EditorState => {
+export const reduce = (state: EditorState, action: EditorAction): EditorState => {
   switch (action.type) {
     case 'set-text': {
       return {

package/src/ui/binary-value-editor.tsx

@@ -4,11 +4,7 @@ import { EditorView, keymap } from '@codemirror/view';
 import { cn } from '@rozenite/ui';
 import { useEffect, useReducer, useRef, useState } from 'react';
 import { compactAsciiPreview } from './binary';
-import {
-  initialState,
-  reduce,
-  type EditorMode,
-} from './binary-value-editor-state';
+import { initialState, reduce, type EditorMode } from './binary-value-editor-state';
 
 export type BinaryValueEditorProps = {
   initialBytes?: number[];
@@ -57,13 +53,8 @@ const ModeButton = ({
   </button>
 );
 
-export const BinaryValueEditor = ({
-  initialBytes,
-  onChange,
-}: BinaryValueEditorProps) => {
-  const [state, dispatch] = useReducer(reduce, undefined, () =>
-    initialState({}),
-  );
+export const BinaryValueEditor = ({ initialBytes, onChange }: BinaryValueEditorProps) => {
+  const [state, dispatch] = useReducer(reduce, undefined, () => initialState({}));
   const initialBytesRef = useRef(initialBytes);
   const [isPreparing, setIsPreparing] = useState(
     Boolean(initialBytesRef.current && initialBytesRef.current.length > 0),
@@ -108,9 +99,7 @@ export const BinaryValueEditor = ({
             if (!update.docChanged) return;
             const newText = update.state.doc.toString();
             if (newText === stateRef.current.text) return;
-            const isPaste = update.transactions.some((tr) =>
-              tr.isUserEvent('input.paste'),
-            );
+            const isPaste = update.transactions.some((tr) => tr.isUserEvent('input.paste'));
             dispatch({
               type: isPaste ? 'normalize-paste' : 'set-text',
               text: newText,
@@ -181,11 +170,10 @@ export const BinaryValueEditor = ({
         <div className="text-muted-foreground">{byteCount} bytes</div>
         {asciiPreview && (
           <div className="overflow-hidden text-ellipsis whitespace-nowrap text-muted-foreground">
-            ASCII:{' '}
-            <span className="font-mono text-foreground">{asciiPreview}</span>
+            ASCII: <span className="font-mono text-foreground">{asciiPreview}</span>
           </div>
         )}
-        {state.error && <div className="text-destructive">{state.error}</div>}
+        {state.error && <div className="text-danger">{state.error}</div>}
       </div>
     </div>
   );

package/src/ui/binary.ts

@@ -1,6 +1,4 @@
-export type ParseResult<T> =
-  | { ok: true; value: T }
-  | { ok: false; error: string };
+export type ParseResult<T> = { ok: true; value: T } | { ok: false; error: string };
 
 const BYTES_PER_LINE = 16;
 const BYTES_PER_GROUP = 8;
@@ -11,13 +9,10 @@ const OFFSET_WIDTH = 8;
 const ASCII_PRINTABLE_MIN = 0x20;
 const ASCII_PRINTABLE_MAX = 0x7e;
 
-const toHexPair = (byte: number): string =>
-  byte.toString(16).toUpperCase().padStart(2, '0');
+const toHexPair = (byte: number): string => byte.toString(16).toUpperCase().padStart(2, '0');
 
 const toAsciiChar = (byte: number): string =>
-  byte >= ASCII_PRINTABLE_MIN && byte <= ASCII_PRINTABLE_MAX
-    ? String.fromCharCode(byte)
-    : '.';
+  byte >= ASCII_PRINTABLE_MIN && byte <= ASCII_PRINTABLE_MAX ? String.fromCharCode(byte) : '.';
 
 const formatHexLine = (slice: readonly number[]): string => {
   const left = slice.slice(0, BYTES_PER_GROUP).map(toHexPair).join(' ');
@@ -33,10 +28,7 @@ export type HexdumpRow = {
 
 // Produces one visible hexdump row. Unlike bytesToHexdump this never builds a
 // representation for bytes outside the requested row.
-export const formatHexdumpRow = (
-  bytes: readonly number[],
-  rowStart: number,
-): HexdumpRow => {
+export const formatHexdumpRow = (bytes: readonly number[], rowStart: number): HexdumpRow => {
   let left = '';
   let right = '';
   let ascii = '';
@@ -82,10 +74,7 @@ export const bytesToHexdump = (bytes: readonly number[]): string => {
 export const bytesToAsciiPreview = (bytes: readonly number[]): string =>
   bytes.map(toAsciiChar).join('');
 
-export const compactAsciiPreview = (
-  bytes: readonly number[],
-  maxBytes = 64,
-): string => {
+export const compactAsciiPreview = (bytes: readonly number[], maxBytes = 64): string => {
   let preview = '';
   const limit = Math.min(bytes.length, maxBytes);
   for (let index = 0; index < limit; index++) {
@@ -133,9 +122,7 @@ const TRAILING_ASCII_COLUMN_RE = /\|[^|]*\|\s*$/;
 export const hexInputToBytes = (input: string): ParseResult<number[]> => {
   const cleaned = input
     .split(/\r?\n/)
-    .map((line) =>
-      line.replace(TRAILING_ASCII_COLUMN_RE, '').replace(HEXDUMP_OFFSET_RE, ''),
-    )
+    .map((line) => line.replace(TRAILING_ASCII_COLUMN_RE, '').replace(HEXDUMP_OFFSET_RE, ''))
     .join('')
     .replace(/0x/gi, '')
     .replace(/\s+/g, '');

package/src/ui/edit-entry-dialog.tsx

@@ -1,10 +1,6 @@
-import { Button, ConfirmDialog, Dialog, Field } from '@rozenite/ui';
+import { Button, Dialog, Field, useConfirmDialog } from '@rozenite/ui';
 import { useEffect, useRef, useState } from 'react';
-import type {
-  StorageEntry,
-  StorageEntryType,
-  StorageEntryValue,
-} from '../shared/types';
+import type { StorageEntry, StorageEntryType, StorageEntryValue } from '../shared/types';
 import { TypedValueEditor } from './typed-value-editor';
 import { defaultValueForType } from './type-conversion';
 
@@ -32,9 +28,7 @@ export const EditEntryDialog = ({
   const [currentValue, setCurrentValue] = useState<StorageEntryValue | null>(
     defaultValueForType('string'),
   );
-  const [alert, setAlert] = useState<{ title: string; message: string } | null>(
-    null,
-  );
+  const confirm = useConfirmDialog();
 
   useEffect(() => {
     if (entry && isOpen) {
@@ -54,13 +48,14 @@ export const EditEntryDialog = ({
     onClose();
   };
 
-  const handleSave = () => {
+  const handleSave = async () => {
     if (!entry || currentValue === null) return;
 
     if (!isCurrentTypeSupported) {
-      setAlert({
+      await confirm({
+        variant: 'alert',
         title: 'Unsupported Type',
-        message: 'This storage does not support the selected type.',
+        description: 'This storage does not support the selected type.',
       });
       return;
     }
@@ -71,7 +66,7 @@ export const EditEntryDialog = ({
 
   const handleKeyDown = (event: React.KeyboardEvent) => {
     if (event.key === 'Enter' && currentType !== 'buffer') {
-      handleSave();
+      void handleSave();
     }
   };
 
@@ -85,71 +80,57 @@ export const EditEntryDialog = ({
   const isSaveDisabled = !isCurrentTypeSupported || currentValue === null;
 
   return (
-    <>
-      <Dialog
-        open={isOpen}
-        onOpenChange={(open) => {
-          if (!open) resetAndClose();
-        }}
-      >
-        <Dialog.Content onKeyDown={handleKeyDown}>
-          <Dialog.Header>
-            <Dialog.Title>Edit Entry</Dialog.Title>
-          </Dialog.Header>
-
-          <div className="flex flex-col gap-4">
-            <Field>
-              <Field.Label>Key</Field.Label>
-              <div className="h-8 w-full truncate rounded-md border border-input bg-muted px-3 py-1.5 font-mono text-sm text-foreground">
-                {entryForDisplay.key}
-              </div>
-              <Field.Description>
-                Key cannot be changed during editing
+    <Dialog
+      open={isOpen}
+      onOpenChange={(open) => {
+        if (!open) resetAndClose();
+      }}
+    >
+      <Dialog.Content onKeyDown={handleKeyDown}>
+        <Dialog.Header>
+          <Dialog.Title>Edit Entry</Dialog.Title>
+        </Dialog.Header>
+
+        <div className="flex flex-col gap-4">
+          <Field>
+            <Field.Label>Key</Field.Label>
+            <div className="h-8 w-full truncate rounded-md border border-input bg-muted px-3 py-1.5 font-mono text-sm text-foreground">
+              {entryForDisplay.key}
+            </div>
+            <Field.Description>Key cannot be changed during editing</Field.Description>
+          </Field>
+
+          <Field>
+            <Field.Label htmlFor="edit-entry-value">Value</Field.Label>
+            <TypedValueEditor
+              key={entryForDisplay.key}
+              supportedTypes={supportedTypes}
+              type={currentType}
+              value={currentValue}
+              onChange={(nextType, nextValue) => {
+                setCurrentType(nextType);
+                setCurrentValue(nextValue);
+              }}
+              inputId="edit-entry-value"
+              autoFocus
+            />
+            {!isCurrentTypeSupported && (
+              <Field.Description className="text-danger">
+                This storage does not support {currentType} values.
               </Field.Description>
-            </Field>
-
-            <Field>
-              <Field.Label htmlFor="edit-entry-value">Value</Field.Label>
-              <TypedValueEditor
-                key={entryForDisplay.key}
-                supportedTypes={supportedTypes}
-                type={currentType}
-                value={currentValue}
-                onChange={(nextType, nextValue) => {
-                  setCurrentType(nextType);
-                  setCurrentValue(nextValue);
-                }}
-                inputId="edit-entry-value"
-                autoFocus
-              />
-              {!isCurrentTypeSupported && (
-                <Field.Description className="text-destructive">
-                  This storage does not support {currentType} values.
-                </Field.Description>
-              )}
-            </Field>
-          </div>
-
-          <Dialog.Footer>
-            <Button variant="outline" onClick={resetAndClose}>
-              Cancel
-            </Button>
-            <Button onClick={handleSave} disabled={isSaveDisabled}>
-              Save Changes
-            </Button>
-          </Dialog.Footer>
-        </Dialog.Content>
-      </Dialog>
-
-      <ConfirmDialog
-        open={alert !== null}
-        onOpenChange={(open) => {
-          if (!open) setAlert(null);
-        }}
-        variant="alert"
-        title={alert?.title ?? ''}
-        description={alert?.message}
-      />
-    </>
+            )}
+          </Field>
+        </div>
+
+        <Dialog.Footer>
+          <Button tone="neutral" variant="outline" onClick={resetAndClose}>
+            Cancel
+          </Button>
+          <Button onClick={() => void handleSave()} disabled={isSaveDisabled}>
+            Save Changes
+          </Button>
+        </Dialog.Footer>
+      </Dialog.Content>
+    </Dialog>
   );
 };

package/src/ui/editor-switcher.tsx

@@ -10,12 +10,7 @@ const TYPE_LABELS: Record<StorageEntryType, string> = {
 
 // Visual ordering of the pills. Keep `string` first because it's the
 // most common landing type after a fresh read on an MMKV key.
-const TYPE_ORDER: StorageEntryType[] = [
-  'string',
-  'number',
-  'boolean',
-  'buffer',
-];
+const TYPE_ORDER: StorageEntryType[] = ['string', 'number', 'boolean', 'buffer'];
 
 export type EditorSwitcherProps = {
   supportedTypes: StorageEntryType[];
@@ -23,11 +18,7 @@ export type EditorSwitcherProps = {
   onChange: (type: StorageEntryType) => void;
 };
 
-export const EditorSwitcher = ({
-  supportedTypes,
-  value,
-  onChange,
-}: EditorSwitcherProps) => {
+export const EditorSwitcher = ({ supportedTypes, value, onChange }: EditorSwitcherProps) => {
   const available = TYPE_ORDER.filter((type) => supportedTypes.includes(type));
 
   // Adaptive hide: the switcher is meaningless when the backend only