Github/screenshot-to-code
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

rename to KeyboardShortcutBadge

Browse Source
This commit is contained in:
Abi Raja 2024-07-11 14:20:50 -04:00
parent f6da5eb0d4
commit 6c2bd1eb64
3 changed files with 9 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
frontend/src/App.tsx
View File

@ -41,7 +41,7 @@ import useBrowserTabIndicator from "./hooks/useBrowserTabIndicator";
import TipLink from "./components/core/TipLink"; import TipLink from "./components/core/TipLink";
import SelectAndEditModeToggleButton from "./components/select-and-edit/SelectAndEditModeToggleButton"; import SelectAndEditModeToggleButton from "./components/select-and-edit/SelectAndEditModeToggleButton";
import { useAppStore } from "./store/app-store"; import { useAppStore } from "./store/app-store";
import KeyBadge from "./components/core/KeyBadge"; import KeyboardShortcutBadge from "./components/core/KeyboardShortcutBadge";
const IS_OPENAI_DOWN = false; const IS_OPENAI_DOWN = false;
@ -534,7 +534,7 @@ function App() {
onClick={() => doUpdate(updateInstruction)} onClick={() => doUpdate(updateInstruction)}
className="dark:text-white dark:bg-gray-700 update-btn" className="dark:text-white dark:bg-gray-700 update-btn"
> >
Update <KeyBadge letter="enter" /> Update <KeyboardShortcutBadge letter="enter" />
</Button> </Button>
</div> </div>
<div className="flex items-center justify-end gap-x-2 mt-2"> <div className="flex items-center justify-end gap-x-2 mt-2">

8
frontend/src/components/core/KeyBadge.tsx → frontend/src/components/core/KeyboardShortcutBadge.tsx
View File

@ -1,11 +1,13 @@
import React from "react"; import React from "react";
import { BsArrowReturnLeft } from "react-icons/bs"; import { BsArrowReturnLeft } from "react-icons/bs";
interface KeyBadgeProps { interface KeyboardShortcutBadgeProps {
letter: string; letter: string;
} }
const KeyBadge: React.FC<KeyBadgeProps> = ({ letter }) => { const KeyboardShortcutBadge: React.FC<KeyboardShortcutBadgeProps> = ({
letter,
}) => {
const icon = const icon =
letter.toLowerCase() === "enter" || letter.toLowerCase() === "return" ? ( letter.toLowerCase() === "enter" || letter.toLowerCase() === "return" ? (
<BsArrowReturnLeft /> <BsArrowReturnLeft />
@ -20,4 +22,4 @@ const KeyBadge: React.FC<KeyBadgeProps> = ({ letter }) => {
); );
}; };
export default KeyBadge; export default KeyboardShortcutBadge;

4
frontend/src/components/select-and-edit/EditPopup.tsx
View File

@ -3,7 +3,7 @@ import { Textarea } from "../ui/textarea";
import { Button } from "../ui/button"; import { Button } from "../ui/button";
import { addHighlight, getAdjustedCoordinates, removeHighlight } from "./utils"; import { addHighlight, getAdjustedCoordinates, removeHighlight } from "./utils";
import { useAppStore } from "../../store/app-store"; import { useAppStore } from "../../store/app-store";
import KeyBadge from "../core/KeyBadge"; import KeyboardShortcutBadge from "../core/KeyboardShortcutBadge";
interface EditPopupProps { interface EditPopupProps {
event: MouseEvent | null; event: MouseEvent | null;
@ -140,7 +140,7 @@ const EditPopup: React.FC<EditPopupProps> = ({
className="dark:bg-gray-700 dark:text-white" className="dark:bg-gray-700 dark:text-white"
onClick={() => onUpdate(updateText)} onClick={() => onUpdate(updateText)}
> >
Update <KeyBadge letter="enter" /> Update <KeyboardShortcutBadge letter="enter" />
</Button> </Button>
</div> </div>
</div> </div>