@deckbuilderkit/view-rest 0.0.0-stage → 0.1.1

package/README.md

@@ -1,3 +1,13 @@
-# Temporary Holding Version
+# @deckbuilderkit/view-rest
 
-This version is a temporary placeholder for this package. An operational version to replace this has been submitted for review and is awaiting a staged release.
+REST
+
+- Id: `rest`.
+- `src/view.tsx`: web entry (built with `defineView`).
+- `src/server.ts`: server entry (built with `defineServerView`; validates the view's settings and serves its routes).
+- `src/i18n.ts`: messages (en, pt-BR) and the view's typed `t`.
+- `src/settings.ts`: setting types and schema.
+
+Settings: REST client view: requests, environments, saved requests and history.
+owns the `rest` state (panel sizes, active environment, history size). No Settings cards.
+Links and capabilities: none.

package/package.json

@@ -1,6 +1,40 @@
 {
   "name": "@deckbuilderkit/view-rest",
-  "version": "0.0.0-stage",
-  "stub": true,
-  "description": "Temporary package placeholder for staged publishing"
-}
+  "version": "0.1.1",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/adrianogpena/deckbuilder.git",
+    "directory": "packages/view-rest"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "files": [
+    "src",
+    "!src/**/*.test.ts"
+  ],
+  "type": "module",
+  "exports": {
+    "./web": "./src/web.ts",
+    "./server": "./src/server.ts",
+    "./styles.css": "./src/rest.css"
+  },
+  "dependencies": {
+    "@deckbuilderkit/editor": "0.1.1",
+    "@deckbuilderkit/platform": "0.1.1",
+    "@deckbuilderkit/server-core": "0.1.1",
+    "@deckbuilderkit/server-mods": "0.1.1",
+    "@deckbuilderkit/ui": "0.1.1"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
+  },
+  "devDependencies": {
+    "@types/react": "^18.3.12",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1",
+    "@types/react-dom": "^18.3.1"
+  }
+}

package/src/RestScreen.tsx

@@ -0,0 +1,309 @@
+import { useEffect, useRef, useState } from 'react';
+import { draftToSpec, hasAuthHeader, type HttpRequestDraft, type ImportedRequest, RequestEditor, ResponseView, toCurl } from '@deckbuilderkit/editor';
+import type { HttpResponseInfo, RestEnvVar } from '@deckbuilderkit/server-core/protocol';
+import { type ApiError, ErrorBanner, errorOf, Icon, PageHead, SplitView, useAsync, useCommand, useDebouncedSave, useDialogs, useViewRequest } from '@deckbuilderkit/ui';
+import { restCommands } from './commands';
+import { restApi as api } from './client';
+import type { RestSettings, RestViewSettings, SavedRequest } from './settings';
+import { t } from './i18n';
+import './rest.css';
+import { ImportDialog, requestLabel } from './rest/ImportDialog';
+import { CurlDialog } from './rest/CurlDialog';
+import { HistoryPanel } from './rest/HistoryPanel';
+import { EnvironmentsDialog } from './rest/EnvironmentsDialog';
+import { RestTabBar } from './rest/RestTabBar';
+import { openRestTab, restTabs, runtimeOf, useRestTabs } from './rest/tabs-store';
+
+const NO_VARS: RestEnvVar[] = [];
+const MAX_NAME = 80;
+
+/** `name`, or `name (2)`, `name (3)`… when taken; the result stays within the name limit. */
+function uniqueName(name: string, taken: Set<string>): string {
+  const base = name.trim().slice(0, MAX_NAME) || 'Request';
+  let candidate = base;
+  for (let n = 2; taken.has(candidate); n++) {
+    const suffix = ` (${n})`;
+    candidate = base.slice(0, MAX_NAME - suffix.length) + suffix;
+  }
+  return candidate;
+}
+
+const DEFAULT_MAIN: [number, number] = [0.5, 0.5];
+
+export function RestScreen({ settings, onSave }: { settings: RestViewSettings; onSave: (patch: Partial<RestViewSettings>) => void }) {
+  const saved = useAsync(() => api.requests(), []);
+  const { confirm, prompt, element } = useDialogs();
+  const [state, setState] = useState<RestSettings>(settings.rest ?? {});
+  const { tabs, active, full } = useRestTabs();
+  useEffect(() => restTabs.setSaved(saved.data), [saved.data]);
+  const tab = tabs.find((t) => t.id === active) ?? tabs[0]!;
+  const draft = tab.draft;
+  const loaded = tab.savedId ? saved.data?.find((r) => r.id === tab.savedId) : undefined;
+  const { auth, imported, response, error, sending, savedPath } = runtimeOf(tab.id);
+  const [importing, setImporting] = useState(false);
+  const [curl, setCurl] = useState<string>();
+  const [actionError, setActionError] = useState<ApiError>();
+  const { request: incoming, take: takeIncoming } = useViewRequest<ImportedRequest>('rest');
+  useEffect(() => {
+    if (!incoming) return;
+    const request = takeIncoming();
+    if (request && openRestTab(request.draft, request.auth, request.name) === null) setActionError({ message: t('rest.tab.full') } as ApiError);
+  }, [incoming]);
+  const [dragId, setDragId] = useState<string | null>(null);
+  const [dragOver, setDragOver] = useState<string | null>(null);
+
+  const environments = useAsync(() => api.environments(), []);
+  const [managing, setManaging] = useState(false);
+  /** Active environment id ('' = none); only sent while it still exists. */
+  const environment = settings.rest?.environment ?? '';
+  const activeEnv = environments.data?.find((e) => e.id === environment);
+  const setEnvironment = (id: string) => onSave({ rest: { ...settings.rest, environment: id } });
+
+  const [historyOpen, setHistoryOpen] = useState(false);
+  const [historyTick, setHistoryTick] = useState(0);
+  const historyOpenRef = useRef(historyOpen);
+  historyOpenRef.current = historyOpen;
+
+  const persist = useDebouncedSave((next: RestSettings) => onSave({ rest: { ...settings.rest, sizes: next.sizes } }));
+  const sizes = state.sizes?.main ?? DEFAULT_MAIN;
+
+  const setDraft = (next: HttpRequestDraft) => restTabs.update(tab.id, { draft: next });
+  const setAuth = (value: string) => restTabs.setRuntime(tab.id, { auth: value });
+  const send = () =>
+    void restTabs
+      .send(tab.id, auth && !hasAuthHeader(draft.headers) ? [['Authorization', auth]] : undefined, environments.data ? activeEnv?.id : environment || undefined)
+      .then(() => historyOpenRef.current && setHistoryTick((n) => n + 1));
+  const cancel = () => restTabs.cancel(tab.id);
+
+  const loadImported = (item: ImportedRequest) => restTabs.loadImported(tab.id, item.draft, item.name ?? '', item.auth);
+
+  const saveImported = async (items: ImportedRequest[]) => {
+    const taken = new Set((saved.data ?? []).map((r) => r.name));
+    try {
+      for (const item of items) {
+        const name = uniqueName(requestLabel(item), taken);
+        taken.add(name);
+        await api.createRequest({ name, request: item.draft, ...(item.auth ? { auth: item.auth } : {}) });
+      }
+    } finally {
+      saved.reload();
+    }
+  };
+
+  const save = async (asNew: boolean) => {
+    const { id, savedId } = tab;
+    setActionError(undefined);
+    try {
+      let name = loaded?.name ?? tab.title;
+      if (asNew || !savedId || !name) {
+        name =
+          (await prompt({
+            title: t('rest.saveAsTitle'),
+            label: t('rest.name'),
+            value: name ?? imported?.name ?? '',
+            validate: (v) => (v.trim() ? null : t('error.badRequestName')),
+          })) ?? undefined;
+        if (!name) return;
+      }
+      // Switching a saved request from Basic/Bearer to None clears its secret ('' removes it).
+      const cleared = !auth && !draft.authKind && !!loaded?.request.authKind && !asNew;
+      const input = { name, request: draft, ...(auth ? { auth } : cleared ? { auth: '' } : {}) };
+      const record = asNew || !savedId ? await api.createRequest(input) : await api.updateRequest(savedId, input);
+      restTabs.markSaved(id, record);
+      saved.reload();
+    } catch (err) {
+      setActionError(errorOf(err));
+    }
+  };
+  useCommand(restCommands()[0]!, () => void save(false));
+
+  const remove = async (item: SavedRequest) => {
+    if (!(await confirm({ title: t('rest.deleteTitle', { name: item.name }), okLabel: t('rest.delete'), danger: true }))) return;
+    setActionError(undefined);
+    try {
+      await api.deleteRequest(item.id);
+      restTabs.savedChanged(item.id);
+      saved.reload();
+    } catch (err) {
+      setActionError(errorOf(err));
+    }
+  };
+
+  const rename = async (item: SavedRequest) => {
+    const name = await prompt({
+      title: t('rest.renameTitle'),
+      label: t('rest.name'),
+      value: item.name,
+      validate: (v) => (v.trim() ? null : t('error.badRequestName')),
+    });
+    if (!name || name.trim() === item.name) return;
+    setActionError(undefined);
+    try {
+      const record = await api.updateRequest(item.id, { name, request: item.request });
+      restTabs.savedChanged(item.id, record);
+      saved.reload();
+    } catch (err) {
+      setActionError(errorOf(err));
+    }
+  };
+
+  const moveTo = async (fromId: string, toId: string) => {
+    const ids = (saved.data ?? []).map((r) => r.id);
+    const from = ids.indexOf(fromId);
+    const to = ids.indexOf(toId);
+    if (from < 0 || to < 0 || from === to) return;
+    ids.splice(to, 0, ...ids.splice(from, 1));
+    setActionError(undefined);
+    try {
+      await api.reorderRequests(ids);
+    } catch (err) {
+      setActionError(errorOf(err));
+    } finally {
+      saved.reload();
+    }
+  };
+
+  const showCurl = async () => {
+    const spec = draftToSpec(draft);
+    let value = auth || undefined;
+    if (!value && tab.savedId && loaded?.auth?.hasSecret && !hasAuthHeader(draft.headers)) {
+      setActionError(undefined);
+      try {
+        value = (await api.requestAuth(tab.savedId)).value ?? undefined;
+      } catch (err) {
+        setActionError(errorOf(err));
+        return;
+      }
+    }
+    setCurl(toCurl(spec, value));
+  };
+
+  const saveResponse = async (info: HttpResponseInfo) => {
+    const id = tab.id;
+    setActionError(undefined);
+    try {
+      const { path } = await api.httpSave(info.id);
+      if (path) restTabs.setRuntime(id, { savedPath: path });
+    } catch (err) {
+      setActionError(errorOf(err));
+    }
+  };
+
+  return (
+    <div className="content screen-edges">
+      <PageHead title={t('nav.rest')}>
+        <div className="row">
+          <button className="btn btn-sm" onClick={() => setImporting(true)}>{t('rest.import')}</button>
+          <button className="btn btn-sm" onClick={() => void showCurl()}>{t('rest.code')}</button>
+          <button className="btn btn-sm" onClick={() => save(false)}>{t('rest.save')}</button>
+          <button className="btn btn-sm" onClick={() => save(true)}>{t('rest.saveAs')}</button>
+        </div>
+      </PageHead>
+      {actionError && <ErrorBanner error={actionError} compact />}
+      {full && <p className="muted" role="status">{t('rest.tab.full')}</p>}
+      <div className="rest-body">
+        <aside className="rest-list">
+          <div className="rest-list-head">
+            <span className="mono-label">{t('rest.saved')}</span>
+            <button className="btn btn-sm" onClick={restTabs.newTab}><Icon name="plus" /> {t('rest.new')}</button>
+          </div>
+          {saved.error && <ErrorBanner error={saved.error} onRetry={saved.reload} compact />}
+          {saved.data?.length === 0 && <p className="muted">{t('rest.none')}</p>}
+          {saved.data?.map((item) => (
+            <div
+              key={item.id}
+              className={`rest-item${item.id === tab.savedId ? ' active' : ''}${item.id === dragOver ? ' drop-target' : ''}`}
+              draggable
+              onDragStart={(e) => {
+                e.dataTransfer.effectAllowed = 'move';
+                e.dataTransfer.setData('text/plain', item.id);
+                setDragId(item.id);
+              }}
+              onDragOver={(e) => {
+                if (dragId === null) return;
+                e.preventDefault();
+                setDragOver(item.id);
+              }}
+              onDrop={(e) => {
+                e.preventDefault();
+                if (dragId !== null) void moveTo(dragId, item.id);
+                setDragId(null);
+                setDragOver(null);
+              }}
+              onDragEnd={() => {
+                setDragId(null);
+                setDragOver(null);
+              }}
+            >
+              <button className="rest-item-main" onClick={() => restTabs.openSaved(item)} title={item.request.url}>
+                <span className="rest-method">{item.request.method}</span>
+                <span className="rest-item-name">{item.name}</span>
+              </button>
+              <span className="rest-item-actions">
+                <button className="btn btn-ghost btn-sm btn-icon" onClick={() => rename(item)} aria-label={t('rest.rename')} title={t('rest.rename')}>
+                  <Icon name="edit" />
+                </button>
+                <button className="btn btn-ghost btn-sm btn-icon" onClick={() => remove(item)} aria-label={t('rest.delete')} title={t('rest.delete')}>
+                  <Icon name="trash" />
+                </button>
+              </span>
+            </div>
+          ))}
+        </aside>
+        <div className="rest-main">
+        <RestTabBar
+          tabs={tabs}
+          active={tab.id}
+          saved={saved.data}
+          env={{ environments: environments.data, environment, onEnvironment: setEnvironment, onManage: () => setManaging(true), history: historyOpen, onHistory: () => setHistoryOpen((v) => !v) }}
+        />
+        <SplitView
+          direction="column"
+          sizes={[sizes[0], sizes[1]]}
+          defaultSizes={DEFAULT_MAIN}
+          onResize={(s) => {
+            const next = { ...state, sizes: { main: [s[0], s[1]] as [number, number] } };
+            setState(next);
+            persist(next);
+          }}
+        >
+          <div key="request" className="rest-pane">
+            <RequestEditor
+              value={draft}
+              onChange={setDraft}
+              onSend={send}
+              onCancel={cancel}
+              sending={sending}
+              variables={activeEnv?.vars ?? NO_VARS}
+              auth={{
+                value: auth,
+                onChange: setAuth,
+                disabled: !tab.savedId && !imported?.auth,
+                placeholder: loaded?.auth?.hasSecret ? t('rest.authSaved') : undefined,
+                hasSaved: !!loaded?.auth?.hasSecret,
+                hint: tab.savedId ? t('rest.authHint') : imported?.auth ? t('rest.authImported') : t('rest.authNeedsSave'),
+              }}
+            />
+          </div>
+          <div key="response" className="rest-pane">
+            {savedPath && <p className="muted">{t('rest.responseSaved', { path: savedPath })}</p>}
+            <ResponseView response={response} error={error} sending={sending} onSave={response ? () => saveResponse(response) : undefined} />
+          </div>
+        </SplitView>
+        </div>
+        {historyOpen && <HistoryPanel refresh={historyTick} confirm={confirm} onClose={() => setHistoryOpen(false)} />}
+      </div>
+      {importing && <ImportDialog onLoad={loadImported} onSaveMany={saveImported} onClose={() => setImporting(false)} />}
+      {managing && (
+        <EnvironmentsDialog
+          environments={environments.data}
+          onChanged={environments.reload}
+          onDeleted={(id) => id === environment && setEnvironment('')}
+          onClose={() => setManaging(false)}
+        />
+      )}
+      {curl !== undefined && <CurlDialog curl={curl} onClose={() => setCurl(undefined)} />}
+      {element}
+    </div>
+  );
+}

package/src/client.ts

@@ -0,0 +1,41 @@
+import type { HttpClient } from '@deckbuilderkit/editor';
+import type { RestEnvironment, RestEnvironmentInput, RestHistoryEntry } from '@deckbuilderkit/server-core/protocol';
+import type { RestTabsFile, SavedRequest } from './settings';
+
+/** The server calls the REST view makes (the sending and the environment list come from `HttpClient`); the app builds it from its api and passes it to `restView`. */
+export interface RestClient extends HttpClient {
+  requests: () => Promise<SavedRequest[]>;
+  createRequest: (input: Record<string, unknown>) => Promise<SavedRequest>;
+  updateRequest: (id: string, input: Record<string, unknown>) => Promise<SavedRequest>;
+  deleteRequest: (id: string) => Promise<unknown>;
+  reorderRequests: (ids: string[]) => Promise<unknown>;
+  /** The saved Authorization value of request `id`, for Copy as curl. */
+  requestAuth: (id: string) => Promise<{ value: string | null }>;
+  /** Picks a file on the server side; `text` is null when the dialog was cancelled. */
+  importRequestsFile: () => Promise<{ name?: string; text: string | null }>;
+  saveCurl: (text: string) => Promise<{ path: string | null }>;
+  /** Saves the body of the sent response `id`; `path` is null when the dialog was cancelled. */
+  httpSave: (id: string) => Promise<{ path: string | null; bytes?: number }>;
+  restTabs: () => Promise<RestTabsFile>;
+  saveRestTabs: (file: RestTabsFile) => Promise<unknown>;
+  createRestEnvironment: (input: RestEnvironmentInput) => Promise<RestEnvironment>;
+  updateRestEnvironment: (id: string, input: RestEnvironmentInput) => Promise<RestEnvironment>;
+  deleteRestEnvironment: (id: string) => Promise<unknown>;
+  /** Sent requests, newest first; `q` matches method and URL. */
+  restHistory: (q?: string) => Promise<RestHistoryEntry[]>;
+  clearRestHistory: () => Promise<unknown>;
+}
+
+let current: RestClient | undefined;
+
+/** Set by `restView`; the tabs store and the dialogs call the server through `restApi`. */
+export const bindRestClient = (client: RestClient) => {
+  current = client;
+};
+
+export const restApi: RestClient = new Proxy({} as RestClient, {
+  get(_, key) {
+    if (!current) throw new Error('The REST client is not bound');
+    return current[key as keyof RestClient];
+  },
+});

package/src/commands.ts

@@ -0,0 +1,4 @@
+import type { CommandDef } from '@deckbuilderkit/ui';
+import { t } from './i18n';
+
+export const restCommands = (): CommandDef[] => [{ id: 'rest.save', scope: 'rest', label: t('keys.rest.save'), keys: ['Ctrl+S'], inInput: true }];

package/src/i18n.ts

@@ -0,0 +1,180 @@
+import { createT, type Messages } from '@deckbuilderkit/ui';
+
+export const en = {
+  'nav.rest': 'REST',
+  'settings.section.rest': 'REST',
+  'settings.rest.historySize': 'Request history size',
+  'settings.rest.historySize.hint': 'Number of requests kept in the REST history. 0 turns history off.',
+  'rest.saved': 'Saved requests',
+  'rest.new': 'New',
+  'rest.none': 'No saved requests yet.',
+  'rest.save': 'Save',
+  'rest.saveAs': 'Save as…',
+  'rest.saveAsTitle': 'Save request',
+  'rest.name': 'Name',
+  'rest.delete': 'Delete',
+  'rest.rename': 'Rename',
+  'rest.renameTitle': 'Rename request',
+  'rest.deleteTitle': 'Delete "{name}"?',
+  'rest.authHint': 'Sent as the Authorization header, only to the origin of the saved URL.',
+  'rest.authNeedsSave': 'Save the request first to keep an Authorization value.',
+  'rest.authSaved': 'Saved',
+  'rest.responseSaved': 'Saved to {path}',
+  'rest.authImported': 'Imported value. Save as… keeps it.',
+  'rest.tab.untitled': 'New request',
+  'rest.tab.new': 'New tab',
+  'rest.tab.close': 'Close tab',
+  'rest.tab.unsaved': 'Unsaved changes',
+  'rest.tab.full': 'All 30 tabs have unsaved changes. Save or close one to open another.',
+  'rest.import': 'Import',
+  'rest.code': 'Code',
+  'rest.code.title': 'cURL',
+  'rest.code.copy': 'Copy',
+  'rest.code.copied': 'Copied',
+  'rest.code.save': 'Save as file',
+  'rest.code.saved': 'Saved to {path}',
+  'rest.import.title': 'Import requests',
+  'rest.import.paste': 'Paste a cURL command or .http content',
+  'rest.import.openFile': 'Open .http file…',
+  'rest.import.parse': 'Parse',
+  'rest.import.close': 'Close',
+  'rest.import.nothing': 'No request found in this text.',
+  'rest.import.loaded': 'Loaded "{name}" into the editor.',
+  'rest.import.found': '{count} requests found',
+  'rest.import.saveSelected': 'Save selected',
+  'rest.import.warnings': 'Warnings',
+  'rest.import.warn.unknownFlag': 'Ignored the flag {arg}.',
+  'rest.import.warn.missingValue': 'The flag {arg} has no value.',
+  'rest.import.warn.dataFile': 'Data from a file is not read ({arg}); the text was kept as typed.',
+  'rest.import.warn.cookieFile': 'Cookie files are not read ({arg}).',
+  'rest.import.warn.badHeader': 'Skipped a line that is not a header: {arg}',
+  'rest.import.warn.badMethod': 'The method {arg} is not supported; using GET or POST.',
+  'rest.import.warn.extraArgument': 'Ignored the extra argument {arg}.',
+  'rest.import.warn.noUrl': 'No URL found.',
+  'rest.import.warn.bodyFile': 'A body read from a file is not imported ({arg}).',
+  'rest.env.select': 'Environment',
+  'rest.env.none': 'No environment',
+  'rest.env.manage': 'Manage environments…',
+  'rest.env.title': 'Environments',
+  'rest.env.list': 'Environments',
+  'rest.env.empty': 'No environments yet.',
+  'rest.env.name': 'Name',
+  'rest.env.addTitle': 'New environment',
+  'rest.env.renameTitle': 'Rename environment',
+  'rest.env.deleteTitle': 'Delete environment "{name}"?',
+  'rest.env.discard': 'Discard unsaved variable changes?',
+  'rest.env.discardOk': 'Discard',
+  'rest.env.saved': 'Saved "{name}".',
+  'rest.env.hint': 'Use {{name}} in the URL, params, headers, auth and body. Secret values are stored encrypted and never shown again.',
+  'rest.env.var.enabled': 'On',
+  'rest.env.var.name': 'Variable',
+  'rest.env.var.value': 'Value',
+  'rest.env.var.secret': 'Secret',
+  'rest.env.var.set': 'Set',
+  'rest.env.var.notSet': 'Not set',
+  'rest.env.var.replace': 'Replace',
+  'rest.env.var.add': 'Add variable',
+  'rest.env.var.remove': 'Remove variable',
+  'rest.history.toggle': 'History',
+  'rest.history.title': 'History',
+  'rest.history.search': 'Search history',
+  'rest.history.empty': 'No requests sent yet.',
+  'rest.history.clear': 'Clear',
+  'rest.history.clearTitle': 'Clear the request history?',
+  'rest.history.close': 'Close history',
+  'rest.import.warn.unresolvedVar': 'The variable {arg} is not defined.',
+  'keys.rest.save': 'Save request',
+  'error.badEnvironmentName': 'The name must have 1 to 80 characters.',
+  'error.badRequestName': 'The name must have 1 to 80 characters.',
+};
+
+export const ptBR: Messages<typeof en> = {
+  'nav.rest': 'REST',
+  'settings.section.rest': 'REST',
+  'settings.rest.historySize': 'Tamanho do histórico de requisições',
+  'settings.rest.historySize.hint': 'Número de requisições mantidas no histórico REST. 0 desativa o histórico.',
+  'rest.saved': 'Requisições salvas',
+  'rest.new': 'Nova',
+  'rest.none': 'Nenhuma requisição salva.',
+  'rest.save': 'Salvar',
+  'rest.saveAs': 'Salvar como…',
+  'rest.saveAsTitle': 'Salvar requisição',
+  'rest.name': 'Nome',
+  'rest.delete': 'Excluir',
+  'rest.rename': 'Renomear',
+  'rest.renameTitle': 'Renomear requisição',
+  'rest.deleteTitle': 'Excluir "{name}"?',
+  'rest.authHint': 'Enviado como cabeçalho Authorization, só para a origem da URL salva.',
+  'rest.authNeedsSave': 'Salve a requisição primeiro para guardar um valor de Authorization.',
+  'rest.authSaved': 'Salvo',
+  'rest.responseSaved': 'Salvo em {path}',
+  'rest.authImported': 'Valor importado. Salvar como… o mantém.',
+  'rest.tab.untitled': 'Nova requisição',
+  'rest.tab.new': 'Nova aba',
+  'rest.tab.close': 'Fechar aba',
+  'rest.tab.unsaved': 'Alterações não salvas',
+  'rest.tab.full': 'As 30 abas têm alterações não salvas. Salve ou feche uma para abrir outra.',
+  'rest.import': 'Importar',
+  'rest.code': 'Código',
+  'rest.code.title': 'cURL',
+  'rest.code.copy': 'Copiar',
+  'rest.code.copied': 'Copiado',
+  'rest.code.save': 'Salvar como arquivo',
+  'rest.code.saved': 'Salvo em {path}',
+  'rest.import.title': 'Importar requisições',
+  'rest.import.paste': 'Cole um comando cURL ou conteúdo .http',
+  'rest.import.openFile': 'Abrir arquivo .http…',
+  'rest.import.parse': 'Ler',
+  'rest.import.close': 'Fechar',
+  'rest.import.nothing': 'Nenhuma requisição encontrada neste texto.',
+  'rest.import.loaded': '"{name}" carregada no editor.',
+  'rest.import.found': '{count} requisições encontradas',
+  'rest.import.saveSelected': 'Salvar selecionadas',
+  'rest.import.warnings': 'Avisos',
+  'rest.import.warn.unknownFlag': 'A opção {arg} foi ignorada.',
+  'rest.import.warn.missingValue': 'A opção {arg} não tem valor.',
+  'rest.import.warn.dataFile': 'Dados de arquivo não são lidos ({arg}); o texto foi mantido como está.',
+  'rest.import.warn.cookieFile': 'Arquivos de cookie não são lidos ({arg}).',
+  'rest.import.warn.badHeader': 'Linha ignorada, não é um cabeçalho: {arg}',
+  'rest.import.warn.badMethod': 'O método {arg} não é suportado; usando GET ou POST.',
+  'rest.import.warn.extraArgument': 'O argumento extra {arg} foi ignorado.',
+  'rest.import.warn.noUrl': 'Nenhuma URL encontrada.',
+  'rest.import.warn.bodyFile': 'Corpo lido de arquivo não é importado ({arg}).',
+  'rest.env.select': 'Ambiente',
+  'rest.env.none': 'Sem ambiente',
+  'rest.env.manage': 'Gerenciar ambientes…',
+  'rest.env.title': 'Ambientes',
+  'rest.env.list': 'Ambientes',
+  'rest.env.empty': 'Nenhum ambiente ainda.',
+  'rest.env.name': 'Nome',
+  'rest.env.addTitle': 'Novo ambiente',
+  'rest.env.renameTitle': 'Renomear ambiente',
+  'rest.env.deleteTitle': 'Excluir o ambiente "{name}"?',
+  'rest.env.discard': 'Descartar as alterações não salvas nas variáveis?',
+  'rest.env.discardOk': 'Descartar',
+  'rest.env.saved': '"{name}" salvo.',
+  'rest.env.hint': 'Use {{name}} na URL, parâmetros, cabeçalhos, autenticação e corpo. Valores secretos são guardados criptografados e nunca mais exibidos.',
+  'rest.env.var.enabled': 'Ativa',
+  'rest.env.var.name': 'Variável',
+  'rest.env.var.value': 'Valor',
+  'rest.env.var.secret': 'Secreta',
+  'rest.env.var.set': 'Definido',
+  'rest.env.var.notSet': 'Não definido',
+  'rest.env.var.replace': 'Substituir',
+  'rest.env.var.add': 'Adicionar variável',
+  'rest.env.var.remove': 'Remover variável',
+  'rest.history.toggle': 'Histórico',
+  'rest.history.title': 'Histórico',
+  'rest.history.search': 'Pesquisar histórico',
+  'rest.history.empty': 'Nenhuma requisição enviada ainda.',
+  'rest.history.clear': 'Limpar',
+  'rest.history.clearTitle': 'Limpar o histórico de requisições?',
+  'rest.history.close': 'Fechar histórico',
+  'rest.import.warn.unresolvedVar': 'A variável {arg} não está definida.',
+  'keys.rest.save': 'Salvar requisição',
+  'error.badEnvironmentName': 'O nome deve ter de 1 a 80 caracteres.',
+  'error.badRequestName': 'O nome deve ter de 1 a 80 caracteres.',
+};
+
+export type RestMessageKey = keyof typeof en;
+export const t = createT<RestMessageKey>();

package/src/rest/CurlDialog.tsx

@@ -0,0 +1,40 @@
+import { useState } from 'react';
+import { CodeEditor } from '@deckbuilderkit/editor';
+import { type ApiError, copyText, ErrorBanner, errorOf, Modal } from '@deckbuilderkit/ui';
+import { restApi as api } from '../client';
+import { t } from '../i18n';
+
+export function CurlDialog({ curl, onClose }: { curl: string; onClose: () => void }) {
+  const [copied, setCopied] = useState(false);
+  const [savedPath, setSavedPath] = useState<string>();
+  const [error, setError] = useState<ApiError>();
+
+  const copy = async () => {
+    setCopied(await copyText(curl));
+  };
+  const save = async () => {
+    setError(undefined);
+    try {
+      const { path } = await api.saveCurl(curl);
+      if (path) setSavedPath(path);
+    } catch (err) {
+      setError(errorOf(err));
+    }
+  };
+
+  const footer = (
+    <>
+      <button className="btn" onClick={onClose}>{t('rest.import.close')}</button>
+      <button className="btn" onClick={save}>{t('rest.code.save')}</button>
+      <button className="btn btn-primary" onClick={copy}>{copied ? t('rest.code.copied') : t('rest.code.copy')}</button>
+    </>
+  );
+
+  return (
+    <Modal title={t('rest.code.title')} onClose={onClose} footer={footer}>
+      <CodeEditor value={curl} lang="shell" readOnly height={260} wrap />
+      {savedPath && <p className="muted">{t('rest.code.saved', { path: savedPath })}</p>}
+      {error && <ErrorBanner error={error} compact />}
+    </Modal>
+  );
+}