All files / src/commands CommandButton.tsx

80% Statements 4/5
66.66% Branches 2/3
100% Functions 2/2
80% Lines 4/5

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                          1310x 1310x     1310x             23x                                
import { CommandBinding, useScrollOnSelected } from "just-search-it";
import { Button } from "../ahuora-design-system/ui/button";
import { DialogClose } from "../ahuora-design-system/ui/dialog";
import { ToolTipCover } from "../ahuora-design-system/ui/tooltip";
import { KeyboardShortcuts } from "./KeyboardShortcuts";
 
export function CommandButton({
  selected,
  commandBinding,
}: {
  selected?: boolean;
  commandBinding?: CommandBinding<any>;
}) {
  const scrollRef = useScrollOnSelected(selected);
  Iif (!commandBinding) {
    return null;
  }
  return (
    <ToolTipCover asChild content={commandBinding.metadata.description}>
      <DialogClose asChild>
        <Button
          ref={scrollRef}
          aria-label={commandBinding.metadata.name}
          onClick={() => {
            commandBinding.run();
          }}
          className={`rounded-sm hover:bg-secondary w-full ${
            selected ? "bg-secondary shadow" : "bg-muted"
          }`}
        >
          <div className="flex flex-row items-center w-full gap-2 overflow-hidden text-foreground">
            <span className="text-xl">{commandBinding.metadata.icon}</span>
            {commandBinding.metadata.name}
            <KeyboardShortcuts shortcuts={commandBinding.metadata.shortcuts} />
          </div>
        </Button>
      </DialogClose>
    </ToolTipCover>
  );
}