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

100% Statements 78/78
100% Branches 1/1
25% Functions 1/4
100% Lines 78/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
    791x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    1x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
    25x
     "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>
      )
    }