# All files / src/components/features/namespace-manager CreateNamespaceDialog.tsx

0% Statements 0/78
0% Branches 0/1
0% Functions 0/1
0% Lines 0/78

Press n or j to go to the next uncovered block, b, p or k for the previous block.

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79

     "use client"

    import { Button } from '@/components/ui/button'
    import { Input } from '@/components/ui/input'
    import {
      Dialog,
      DialogContent,
      DialogDescription,
      DialogFooter,
      DialogHeader,
      DialogTitle,
      DialogTrigger,
    } from '@/components/ui/dialog'
    import { Plus } from '@phosphor-icons/react'

    interface CreateNamespaceDialogProps {
      open: boolean
      onOpenChange: (open: boolean) => void
      namespaceName: string
      onNamespaceNameChange: (name: string) => void
      onCreateNamespace: () => void
      loading: boolean
    }

    export function CreateNamespaceDialog({
      open,
      onOpenChange,
      namespaceName,
      onNamespaceNameChange,
      onCreateNamespace,
      loading,
    }: CreateNamespaceDialogProps) {
      return (
        <Dialog open={open} onOpenChange={onOpenChange}>
          <DialogTrigger
            className="px-2 py-1 rounded border border-input hover:bg-accent hover:text-accent-foreground"
            data-testid="create-namespace-trigger"
            aria-label="Create new namespace"
          >
            <Plus weight="bold" aria-hidden="true" />
          </DialogTrigger>
          <DialogContent data-testid="create-namespace-dialog">
            <DialogHeader>
              <DialogTitle>Create Namespace</DialogTitle>
              <DialogDescription>
                Create a new namespace to organize your snippets
              </DialogDescription>
            </DialogHeader>
            <div className="space-y-4 py-4">
              <Input
                placeholder="Namespace name"
                value={namespaceName}
                onChange={(e) => onNamespaceNameChange(e.target.value)}
                onKeyPress={(e) => e.key === 'Enter' && onCreateNamespace()}
                data-testid="namespace-name-input"
                aria-label="Namespace name"
              />
            </div>
            <DialogFooter>
              <Button
                variant="outline"
                onClick={() => onOpenChange(false)}
                data-testid="create-namespace-cancel-btn"
              >
                Cancel
              </Button>
              <Button
                onClick={onCreateNamespace}
                disabled={loading}
                data-testid="create-namespace-save-btn"
              >
                Create
              </Button>
            </DialogFooter>
          </DialogContent>
        </Dialog>
      )
    }