From d96be6654db53953e108939591d3e444bcc034a7 Mon Sep 17 00:00:00 2001 From: shadcn Date: Sun, 11 Jun 2023 15:39:04 +0400 Subject: [PATCH] chore: add eslint plugins for import and className sorting --- .eslintrc.json | 22 +- app/api/auth/[...nextauth]/route.ts | 2 +- app/api/chat/route.ts | 3 +- app/chat/[id]/page.tsx | 4 +- app/layout.tsx | 4 +- auth.ts | 2 +- components/chat-list.tsx | 4 +- components/chat-message.tsx | 16 +- components/chat-panel.tsx | 14 +- components/chat.tsx | 3 +- components/empty-screen.tsx | 16 +- components/external-link.tsx | 2 +- components/header.tsx | 17 +- components/icons.tsx | 10 +- components/prompt-form.tsx | 14 +- components/sidebar-item.tsx | 12 +- components/sidebar.tsx | 14 +- components/theme-toggle.tsx | 2 +- components/ui/alert-dialog.tsx | 32 +-- components/ui/button.tsx | 14 +- components/ui/codeblock.tsx | 6 +- components/ui/input.tsx | 2 +- components/ui/separator.tsx | 14 +- components/ui/sheet.tsx | 6 +- components/ui/textarea.tsx | 8 +- components/ui/tooltip.tsx | 2 +- components/user-menu.tsx | 5 +- lib/analytics.ts | 2 +- lib/fonts.ts | 2 +- lib/hooks/use-copy-to-cliipboard.tsx | 1 + lib/hooks/use-enter-submit.tsx | 3 +- lib/hooks/use-window-size.ts | 1 + middleware.ts | 2 +- package.json | 11 +- pnpm-lock.yaml | 389 +++++++++++++++++++++++---- prettier.config.cjs | 35 +++ 36 files changed, 522 insertions(+), 174 deletions(-) create mode 100644 prettier.config.cjs diff --git a/.eslintrc.json b/.eslintrc.json index ef7fd95..6ec5479 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,5 +1,25 @@ { "$schema": "https://json.schemastore.org/eslintrc", "root": true, - "extends": ["next/core-web-vitals", "prettier"] + "extends": [ + "next/core-web-vitals", + "prettier", + "plugin:tailwindcss/recommended" + ], + "plugins": ["tailwindcss"], + "rules": { + "tailwindcss/no-custom-classname": "off" + }, + "settings": { + "tailwindcss": { + "callees": ["cn", "cva"], + "config": "tailwind.config.js" + } + }, + "overrides": [ + { + "files": ["*.ts", "*.tsx"], + "parser": "@typescript-eslint/parser" + } + ] } diff --git a/app/api/auth/[...nextauth]/route.ts b/app/api/auth/[...nextauth]/route.ts index febfb0f..4463a8e 100644 --- a/app/api/auth/[...nextauth]/route.ts +++ b/app/api/auth/[...nextauth]/route.ts @@ -1,2 +1,2 @@ export { GET, POST } from '@/auth' -// export const runtime = 'edge' +// export const runtime = 'edge' diff --git a/app/api/chat/route.ts b/app/api/chat/route.ts index fa86dd5..515d947 100644 --- a/app/api/chat/route.ts +++ b/app/api/chat/route.ts @@ -1,9 +1,10 @@ import { auth } from '@/auth' import { kv } from '@vercel/kv' -import { nanoid } from '@/lib/utils' import { OpenAIStream, StreamingTextResponse } from 'ai-connector' import { Configuration, OpenAIApi } from 'openai-edge' +import { nanoid } from '@/lib/utils' + // export const runtime = 'edge' const configuration = new Configuration({ diff --git a/app/chat/[id]/page.tsx b/app/chat/[id]/page.tsx index 3d78942..728ef16 100644 --- a/app/chat/[id]/page.tsx +++ b/app/chat/[id]/page.tsx @@ -1,8 +1,8 @@ import { type Metadata } from 'next' - import { auth } from '@/auth' -import { getChat } from '@/app/actions' + import { Chat } from '@/components/chat' +import { getChat } from '@/app/actions' // export const runtime = 'edge' export const preferredRegion = 'home' diff --git a/app/layout.tsx b/app/layout.tsx index 2bd830f..153021c 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -3,9 +3,9 @@ import { Metadata } from 'next' import '@/app/globals.css' import { fontMono, fontSans } from '@/lib/fonts' import { cn } from '@/lib/utils' +import { Header } from '@/components/header' import { TailwindIndicator } from '@/components/tailwind-indicator' import { ThemeProvider } from '@/components/theme-provider' -import { Header } from '@/components/header' export const metadata: Metadata = { title: { @@ -40,7 +40,7 @@ export default function RootLayout({ children }: RootLayoutProps) { )} > -
+
{/* @ts-ignore */}
{children}
diff --git a/auth.ts b/auth.ts index afc23f5..aee24e3 100644 --- a/auth.ts +++ b/auth.ts @@ -1,6 +1,6 @@ +import { NextResponse } from 'next/server' import NextAuth from '@auth/nextjs' import GitHub from '@auth/nextjs/providers/github' -import { NextResponse } from 'next/server' export const { handlers: { GET, POST }, diff --git a/components/chat-list.tsx b/components/chat-list.tsx index 167506e..808fd90 100644 --- a/components/chat-list.tsx +++ b/components/chat-list.tsx @@ -2,9 +2,9 @@ import { type Message } from 'ai-connector' +import { Separator } from '@/components/ui/separator' import { ChatMessage } from '@/components/chat-message' import { EmptyScreen } from '@/components/empty-screen' -import { Separator } from '@/components/ui/separator' export interface ChatList { messages: Message[] @@ -12,7 +12,7 @@ export interface ChatList { export function ChatList({ messages }: ChatList) { return ( -
+
{messages.length > 0 ? ( messages.map((message, index) => (
diff --git a/components/chat-message.tsx b/components/chat-message.tsx index 7d5675d..c28fc5d 100644 --- a/components/chat-message.tsx +++ b/components/chat-message.tsx @@ -3,11 +3,11 @@ import { User } from 'lucide-react' import remarkGfm from 'remark-gfm' import remarkMath from 'remark-math' -import { cn } from '@/lib/utils' import { fontMessage } from '@/lib/fonts' +import { cn } from '@/lib/utils' import { CodeBlock } from '@/components/ui/codeblock' -import { MemoizedReactMarkdown } from '@/components/markdown' import { OpenAI } from '@/components/icons' +import { MemoizedReactMarkdown } from '@/components/markdown' export interface ChatMessageProps { message: Message @@ -17,32 +17,32 @@ export function ChatMessage({ message, ...props }: ChatMessageProps) { return (
{children}

+ return

{children}

}, code({ node, inline, className, children, ...props }) { if (children.length) { diff --git a/components/chat-panel.tsx b/components/chat-panel.tsx index c95a004..c184c70 100644 --- a/components/chat-panel.tsx +++ b/components/chat-panel.tsx @@ -3,9 +3,9 @@ import { UseChatHelpers } from 'ai-connector' import { RefreshCcw, StopCircle } from 'lucide-react' +import { Button } from '@/components/ui/button' import { ExternalLink } from '@/components/external-link' import { PromptForm } from '@/components/prompt-form' -import { Button } from '@/components/ui/button' export interface ChatPanelProps extends Pick< @@ -23,8 +23,8 @@ export function ChatPanel({ messages }: ChatPanelProps) { return ( -
-
+
+
{isLoading ? ( ) : ( @@ -42,13 +42,13 @@ export function ChatPanel({ onClick={() => reload()} className="bg-background" > - + Regenerate response ) )}
-
+
{ append({ @@ -58,7 +58,7 @@ export function ChatPanel({ }} isLoading={isLoading} /> -

+

Open source AI chatbot app built with{' '} Next.js and{' '} diff --git a/components/chat.tsx b/components/chat.tsx index 25833c5..738ff71 100644 --- a/components/chat.tsx +++ b/components/chat.tsx @@ -1,6 +1,7 @@ 'use client' import { useChat, type Message } from 'ai-connector' + import { ChatList } from '@/components/chat-list' import { ChatPanel } from '@/components/chat-panel' @@ -17,7 +18,7 @@ export function Chat({ id, initialMessages }: ChatProps) { }) return ( -

+
) { return (
-

+

Welcome to Next.js Chatbot!

-

+

This is an open source AI chatbot app built with{' '} Next.js and{' '} @@ -43,7 +43,7 @@ export function EmptyScreen({ className }: React.ComponentProps<'div'>) { .

-

+

You can start a conversation here or try the following examples:

@@ -51,10 +51,10 @@ export function EmptyScreen({ className }: React.ComponentProps<'div'>) { ))} diff --git a/components/external-link.tsx b/components/external-link.tsx index 175cd6b..ba6cc01 100644 --- a/components/external-link.tsx +++ b/components/external-link.tsx @@ -9,7 +9,7 @@ export function ExternalLink({ {children} +
{/* @ts-ignore */} -
+
-
+
- + GitHub - + Deploy to Vercel Vercel diff --git a/components/icons.tsx b/components/icons.tsx index 6a08c63..b94d72f 100644 --- a/components/icons.tsx +++ b/components/icons.tsx @@ -16,7 +16,7 @@ export function NextChat({ viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg" - className={cn('w-4 h-4', className)} + className={cn('h-4 w-4', className)} {...props} > @@ -95,7 +95,7 @@ export function OpenAI({ className, ...props }: React.ComponentProps<'svg'>) { viewBox="0 0 24 24" role="img" xmlns="http://www.w3.org/2000/svg" - className={cn('w-4 h-4', className)} + className={cn('h-4 w-4', className)} {...props} > OpenAI icon @@ -110,7 +110,7 @@ export function Vercel({ className, ...props }: React.ComponentProps<'svg'>) { aria-label="Vercel logomark" role="img" viewBox="0 0 74 64" - className={cn('w-4 h-4', className)} + className={cn('h-4 w-4', className)} {...props} > ) { viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor" - className={cn('w-4 h-4', className)} + className={cn('h-4 w-4', className)} {...props} > GitHub @@ -151,7 +151,7 @@ export function Separator({ strokeWidth="1" viewBox="0 0 24 24" aria-hidden="true" - className={cn('w-4 h-4', className)} + className={cn('h-4 w-4', className)} {...props} > diff --git a/components/prompt-form.tsx b/components/prompt-form.tsx index cbd40fe..8eb696f 100644 --- a/components/prompt-form.tsx +++ b/components/prompt-form.tsx @@ -1,20 +1,20 @@ 'use client' import * as React from 'react' +import Link from 'next/link' import { CornerDownLeft, Plus } from 'lucide-react' import Textarea from 'react-textarea-autosize' -import { Button, buttonVariants } from '@/components/ui/button' +import { useChatStore } from '@/lib/hooks/use-chat-store' import { useEnterSubmit } from '@/lib/hooks/use-enter-submit' import { cn } from '@/lib/utils' -import { useChatStore } from '@/lib/hooks/use-chat-store' +import { Button, buttonVariants } from '@/components/ui/button' import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip' -import Link from 'next/link' export interface PromptProps { onSubmit: (value: string) => void @@ -50,14 +50,14 @@ export function PromptForm({ onSubmit, isLoading }: PromptProps) { ref={formRef} > -
+
@@ -75,9 +75,9 @@ export function PromptForm({ onSubmit, isLoading }: PromptProps) { onChange={e => setInput(e.target.value)} placeholder="Send a message." spellCheck={false} - className="min-h-[60px] sm:text-sm bg-transparent px-4 py-[1.4rem] focus-within:outline-none w-full resize-none" + className="min-h-[60px] w-full resize-none bg-transparent px-4 py-[1.4rem] focus-within:outline-none sm:text-sm" /> -
+
- + Chat History
@@ -52,7 +52,7 @@ export async function Sidebar({ session, chats }: SidebarProps) { ))}
) : ( -
+

{session?.user ? <>No chat history : <>Login for history}

diff --git a/components/theme-toggle.tsx b/components/theme-toggle.tsx index 230ba4d..56f559d 100644 --- a/components/theme-toggle.tsx +++ b/components/theme-toggle.tsx @@ -1,8 +1,8 @@ 'use client' import * as React from 'react' -import { useTheme } from 'next-themes' import { Moon, Sun } from 'lucide-react' +import { useTheme } from 'next-themes' import { Button } from '@/components/ui/button' diff --git a/components/ui/alert-dialog.tsx b/components/ui/alert-dialog.tsx index 8e03ce5..17fec4d 100644 --- a/components/ui/alert-dialog.tsx +++ b/components/ui/alert-dialog.tsx @@ -1,10 +1,10 @@ -"use client" +'use client' -import * as React from "react" -import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog" +import * as React from 'react' +import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog' -import { cn } from "@/lib/utils" -import { buttonVariants } from "@/components/ui/button" +import { cn } from '@/lib/utils' +import { buttonVariants } from '@/components/ui/button' const AlertDialog = AlertDialogPrimitive.Root @@ -29,7 +29,7 @@ const AlertDialogOverlay = React.forwardRef< >(({ className, children, ...props }, ref) => ( ) => (
) -AlertDialogHeader.displayName = "AlertDialogHeader" +AlertDialogHeader.displayName = 'AlertDialogHeader' const AlertDialogFooter = ({ className, @@ -76,13 +76,13 @@ const AlertDialogFooter = ({ }: React.HTMLAttributes) => (
) -AlertDialogFooter.displayName = "AlertDialogFooter" +AlertDialogFooter.displayName = 'AlertDialogFooter' const AlertDialogTitle = React.forwardRef< React.ElementRef, @@ -90,7 +90,7 @@ const AlertDialogTitle = React.forwardRef< >(({ className, ...props }, ref) => ( )) @@ -102,7 +102,7 @@ const AlertDialogDescription = React.forwardRef< >(({ className, ...props }, ref) => ( )) @@ -128,8 +128,8 @@ const AlertDialogCancel = React.forwardRef< ( , React.ComponentPropsWithoutRef >( ( - { className, orientation = "horizontal", decorative = true, ...props }, + { className, orientation = 'horizontal', decorative = true, ...props }, ref ) => ( {} @@ -10,7 +10,7 @@ const Textarea = React.forwardRef( return (