diff --git a/action/index.ts b/action/index.ts index b743d5b..614b8eb 100644 --- a/action/index.ts +++ b/action/index.ts @@ -4,8 +4,10 @@ import { model } from "@/utils"; export const commitChange = async ({ message, + isEmojiSupport, }: { message: string | null; + isEmojiSupport: boolean; }): Promise<{ data: { text: string; @@ -28,9 +30,29 @@ export const commitChange = async ({ - Suggest 3 different commit messages to give the user some options. - For example, if the user input is "I change lib folder to utils folder", then the output should be: - \`\`\`txt refactor(lib): change lib folder to utils folder \n\`\`\`\n - \`\`\`txt refactor(deps): rename lib folder to utils \n\`\`\`\n - \`\`\`txt fix(deps): rename lib folder to utils \n\`\`\`\n + ${ + isEmojiSupport && + `\ + - Use emojis in the commit message. + - For emojis, you can use https://gitmoji.dev/ + - Don't provide a description, just the commit message. + - For example, if the user input is "I change lib folder to utils folder", then the output should be: + ` + } + + ${ + isEmojiSupport + ? ` + \`\`\`txt \n ♻️ refactor(lib): change lib folder to utils folder \n\`\`\`\n + \`\`\`txt \n ➕ refactor(deps): rename lib folder to utils \n\`\`\`\n + \`\`\`txt \n ✏️ fix(deps): rename lib folder to utils \n\`\`\`\n + ` + : ` + \`\`\`txt \n refactor(lib): change lib folder to utils folder \n\`\`\`\n + \`\`\`txt \n refactor(deps): rename lib folder to utils \n\`\`\`\n + \`\`\`txt \n fix(deps): rename lib folder to utils \n\`\`\`\n + ` + } `, }); diff --git a/app/layout.tsx b/app/layout.tsx index 989f034..2cac42b 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -11,6 +11,7 @@ import { GitHubLogoIcon } from "@radix-ui/react-icons"; import { ModeToggle } from "@/components/modeToggle"; import Image from "next/image"; import NotificationBanner from "@/components/notificationBanner"; +import { TooltipProvider } from "@/components/ui/tooltip"; const inter = Inter({ subsets: ["latin"] }); @@ -61,54 +62,56 @@ export default function RootLayout({ enableSystem disableTransitionOnChange > -
-
-
-
- logo - logo + +
+
+
+
+ logo + logo +
+ + + +
- - - - -
- {children} -
-
- - + {children} + + + + + diff --git a/app/page.tsx b/app/page.tsx index 4fd488d..5962946 100644 --- a/app/page.tsx +++ b/app/page.tsx @@ -15,6 +15,12 @@ import dynamic from "next/dynamic"; import ListSuggestion from "@/components/listSuggestion"; import Loader from "@/components/loader"; import { Spinner } from "@/components/ui/spinner"; +import { Switch } from "@/components/ui/switch"; +import { + Tooltip, + TooltipContent, + TooltipTrigger, +} from "@/components/ui/tooltip"; const EmptyScreen = dynamic(() => import("@/components/emptyScreen"), { ssr: false, @@ -26,18 +32,25 @@ export default function Home() { const [isLoading, setIsLoading] = React.useState(false); const [error, setError] = React.useState(null); const [commitChanges, setcommitChanges] = React.useState(null); + const [isEmojiSupport, setIsEmojiSupport] = React.useState(false); const [commitMessages, setcommitMessages] = React.useState( - null, + null ); const { toast } = useToast(); - const handelSubmit = async ({ suggestion }: { suggestion: string }) => { - if (suggestion === commitChanges) { + const handelSubmit = async ({ + suggestion, + force = false, + }: { + suggestion: string; + force?: boolean; + }) => { + if (!force && suggestion === commitChanges) { toast({ variant: "destructive", - title: "Uh oh! Something went wrong.", - description: "error: Please enter a different message.", + title: "Duplicate Message", + description: "Please enter a different message.", }); return; } @@ -48,6 +61,7 @@ export default function Home() { try { const { data, error } = await commitChange({ message: suggestion, + isEmojiSupport: isEmojiSupport, }); if (error) { @@ -62,7 +76,7 @@ export default function Home() { toastVariants({ variant: "destructive", className: "w-fit m-0 p-2 text-xs hover:bg-[#815305]/35", - }), + }) )} onClick={() => handelSubmit({ suggestion })} > @@ -73,6 +87,7 @@ export default function Home() { } else { if (data) { setcommitMessages(data.text); + console.log(data.text); setcommitChanges(suggestion); setMessage(""); } @@ -86,7 +101,7 @@ export default function Home() { const submitForm = ( e: React.FormEvent, - message: string | null, + message: string | null ): void => { e.preventDefault(); handelSubmit({ suggestion: message || "" }); @@ -100,7 +115,7 @@ export default function Home() { {error ? ( -
+

Oops! Something Went Wrong!{" "} : ( @@ -116,6 +131,7 @@ export default function Home() { suggestions={commitMessages!} commitChanges={commitChanges || ""} submitForm={submitForm} + forceSubmit={handelSubmit} /> ) : (
@@ -147,6 +163,13 @@ export default function Home() { required />
+
+ setIsEmojiSupport(e)} + id="emoji-mode" + /> + +
- + + + + + +

Submit

+ + + + + + + +

Cancel

+ + ) : (

{commitChanges}

- +
+ + + + + +

Regenerate

+ + + + + + + +

Edit

+ + +
)} diff --git a/components/ui/switch.tsx b/components/ui/switch.tsx new file mode 100644 index 0000000..5f4117f --- /dev/null +++ b/components/ui/switch.tsx @@ -0,0 +1,29 @@ +"use client" + +import * as React from "react" +import * as SwitchPrimitives from "@radix-ui/react-switch" + +import { cn } from "@/lib/utils" + +const Switch = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + +)) +Switch.displayName = SwitchPrimitives.Root.displayName + +export { Switch } diff --git a/components/ui/tooltip.tsx b/components/ui/tooltip.tsx new file mode 100644 index 0000000..9e74821 --- /dev/null +++ b/components/ui/tooltip.tsx @@ -0,0 +1,30 @@ +"use client" + +import * as React from "react" +import * as TooltipPrimitive from "@radix-ui/react-tooltip" + +import { cn } from "@/lib/utils" + +const TooltipProvider = TooltipPrimitive.Provider + +const Tooltip = TooltipPrimitive.Root + +const TooltipTrigger = TooltipPrimitive.Trigger + +const TooltipContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, sideOffset = 4, ...props }, ref) => ( + +)) +TooltipContent.displayName = TooltipPrimitive.Content.displayName + +export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider } diff --git a/package.json b/package.json index ae8730d..c4dba89 100644 --- a/package.json +++ b/package.json @@ -28,6 +28,7 @@ "@radix-ui/react-label": "^2.0.2", "@radix-ui/react-scroll-area": "^1.0.5", "@radix-ui/react-slot": "^1.0.2", + "@radix-ui/react-switch": "^1.0.3", "@radix-ui/react-toast": "^1.1.5", "@radix-ui/react-tooltip": "^1.0.7", "@vercel/analytics": "^1.2.2", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7c04754..4f2c4f7 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -29,6 +29,9 @@ dependencies: '@radix-ui/react-slot': specifier: ^1.0.2 version: 1.0.2(@types/react@18.3.1)(react@18.3.1) + '@radix-ui/react-switch': + specifier: ^1.0.3 + version: 1.0.3(@types/react-dom@18.3.0)(@types/react@18.3.1)(react-dom@18.3.1)(react@18.3.1) '@radix-ui/react-toast': specifier: ^1.1.5 version: 1.1.5(@types/react-dom@18.3.0)(@types/react@18.3.1)(react-dom@18.3.1)(react@18.3.1) @@ -1070,6 +1073,33 @@ packages: react: 18.3.1 dev: false + /@radix-ui/react-switch@1.0.3(@types/react-dom@18.3.0)(@types/react@18.3.1)(react-dom@18.3.1)(react@18.3.1): + resolution: {integrity: sha512-mxm87F88HyHztsI7N+ZUmEoARGkC22YVW5CaC+Byc+HRpuvCrOBPTAnXgf+tZ/7i0Sg/eOePGdMhUKhPaQEqow==} + peerDependencies: + '@types/react': '*' + '@types/react-dom': '*' + react: ^16.8 || ^17.0 || ^18.0 + react-dom: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + '@types/react-dom': + optional: true + dependencies: + '@babel/runtime': 7.24.5 + '@radix-ui/primitive': 1.0.1 + '@radix-ui/react-compose-refs': 1.0.1(@types/react@18.3.1)(react@18.3.1) + '@radix-ui/react-context': 1.0.1(@types/react@18.3.1)(react@18.3.1) + '@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.3.0)(@types/react@18.3.1)(react-dom@18.3.1)(react@18.3.1) + '@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.3.1)(react@18.3.1) + '@radix-ui/react-use-previous': 1.0.1(@types/react@18.3.1)(react@18.3.1) + '@radix-ui/react-use-size': 1.0.1(@types/react@18.3.1)(react@18.3.1) + '@types/react': 18.3.1 + '@types/react-dom': 18.3.0 + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + dev: false + /@radix-ui/react-toast@1.1.5(@types/react-dom@18.3.0)(@types/react@18.3.1)(react-dom@18.3.1)(react@18.3.1): resolution: {integrity: sha512-fRLn227WHIBRSzuRzGJ8W+5YALxofH23y0MlPLddaIpLpCDqdE0NZlS2NRQDRiptfxDeeCjgFIpexB1/zkxDlw==} peerDependencies: @@ -1192,6 +1222,20 @@ packages: react: 18.3.1 dev: false + /@radix-ui/react-use-previous@1.0.1(@types/react@18.3.1)(react@18.3.1): + resolution: {integrity: sha512-cV5La9DPwiQ7S0gf/0qiD6YgNqM5Fk97Kdrlc5yBcrF3jyEZQwm7vYFqMo4IfeHgJXsRaMvLABFtd0OVEmZhDw==} + peerDependencies: + '@types/react': '*' + react: ^16.8 || ^17.0 || ^18.0 + peerDependenciesMeta: + '@types/react': + optional: true + dependencies: + '@babel/runtime': 7.24.5 + '@types/react': 18.3.1 + react: 18.3.1 + dev: false + /@radix-ui/react-use-rect@1.0.1(@types/react@18.3.1)(react@18.3.1): resolution: {integrity: sha512-Cq5DLuSiuYVKNU8orzJMbl15TXilTnJKUCltMVQg53BQOF1/C5toAaGrowkgksdBQ9H+SRL23g0HDmg9tvmxXw==} peerDependencies: