Function AddWorkspaceDialog

desktop/src/features/workspaces/ui/AddWorkspaceDialog.tsx:26–191

({
  open,
  onOpenChange,
  onSubmit,
}: AddWorkspaceDialogProps)

};

export function AddWorkspaceDialog({
  open,
  onOpenChange,
  onSubmit,
}: AddWorkspaceDialogProps) {
  const [name, setName] = React.useState("");
  const [relayUrl, setRelayUrl] = React.useState("");
  const [token, setToken] = React.useState("");
  const [reposDir, setReposDir] = React.useState("");
  const [reposDirError, setReposDirError] = React.useState<string | null>(null);

  const handleClose = React.useCallback(() => {
    onOpenChange(false);
    setName("");
    setRelayUrl("");
    setToken("");
    setReposDir("");
    setReposDirError(null);
  }, [onOpenChange]);

  const handleSubmit = React.useCallback(
    async (e: React.FormEvent) => {
      e.preventDefault();
      if (!relayUrl.trim()) {
        return;
      }

      // Expand `~` before save — the backend rejects tilde paths. Empty input
      // resolves to `undefined` so REPOS keeps its default location. Validate
      // the expanded value (the bytes the backend canonicalizes) before save
      // so a bad path is caught here instead of bricking a later boot.
      const expandedReposDir = await expandTilde(reposDir);
      try {
        await validateReposDir(expandedReposDir ?? "");
      } catch (error) {
        setReposDirError(String(error));
        return;
      }

      const workspace: Workspace = {
        id: crypto.randomUUID(),
        name: name.trim() || deriveWorkspaceName(relayUrl.trim()),
        relayUrl: normalizeRelayUrl(relayUrl.trim()),
        token: token.trim() || undefined,
        reposDir: expandedReposDir,
        addedAt: new Date().toISOString(),
      };

      onSubmit(workspace);
      handleClose();
    },
    [name, relayUrl, token, reposDir, onSubmit, handleClose],
  );

  return (
    <Dialog onOpenChange={onOpenChange} open={open}>
      <DialogContent className="max-w-md">
        <DialogHeader>