├── .eslintrc.json
├── .gitignore
├── README.md
├── components.json
├── drizzle.config.ts
├── drizzle
    ├── 0000_past_madripoor.sql
    ├── 0001_round_hammerhead.sql
    ├── 0002_kind_ultragirl.sql
    └── meta
    │   ├── 0000_snapshot.json
    │   ├── 0001_snapshot.json
    │   ├── 0002_snapshot.json
    │   └── _journal.json
├── next.config.js
├── package-lock.json
├── package.json
├── postcss.config.js
├── public
    ├── next.svg
    └── vercel.svg
├── src
    ├── app
    │   ├── _actions
    │   │   └── thread.ts
    │   ├── api
    │   │   └── auth
    │   │   │   └── [...nextauth]
    │   │   │       └── route.ts
    │   ├── dialogue
    │   │   └── [id]
    │   │   │   └── page.tsx
    │   ├── favicon.ico
    │   ├── globals.css
    │   ├── layout.tsx
    │   └── page.tsx
    ├── components
    │   ├── Sidebar.tsx
    │   ├── client
    │   │   ├── AddThreadForm.tsx
    │   │   ├── AuthAlert.tsx
    │   │   ├── ClientToast.tsx
    │   │   ├── RepliesComponent.tsx
    │   │   ├── SignIn.tsx
    │   │   ├── SignOut.tsx
    │   │   ├── TextArea.tsx
    │   │   └── ThreadList.tsx
    │   ├── theme-provider.tsx
    │   ├── theme-toggle.tsx
    │   └── ui
    │   │   ├── button.tsx
    │   │   ├── card.tsx
    │   │   ├── dialog.tsx
    │   │   ├── dropdown-menu.tsx
    │   │   ├── form.tsx
    │   │   ├── input.tsx
    │   │   ├── label.tsx
    │   │   ├── toast.tsx
    │   │   ├── toaster.tsx
    │   │   └── use-toast.ts
    ├── db
    │   ├── index.ts
    │   └── schema.ts
    ├── lib
    │   ├── auth.ts
    │   └── utils.ts
    ├── store
    │   └── useLoginDialogStore.ts
    ├── types
    │   └── next-auth.d.ts
    └── validations
    │   └── thread.ts
├── tailwind.config.js
├── tsconfig.json
└── yarn.lock


/.eslintrc.json:
--------------------------------------------------------------------------------
1 | {
2 |   "extends": "next/core-web-vitals"
3 | }
4 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
 2 | 
 3 | # dependencies
 4 | /node_modules
 5 | /.pnp
 6 | .pnp.js
 7 | 
 8 | # testing
 9 | /coverage
10 | 
11 | # next.js
12 | /.next/
13 | /out/
14 | 
15 | # production
16 | /build
17 | 
18 | # misc
19 | .DS_Store
20 | *.pem
21 | 
22 | # debug
23 | npm-debug.log*
24 | yarn-debug.log*
25 | yarn-error.log*
26 | # local env files
27 | .env
28 | .env*.local
29 | # vercel
30 | .vercel
31 | 
32 | # typescript
33 | *.tsbuildinfo
34 | next-env.d.ts
35 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | This is a [Next.js](https://nextjs.org/) project bootstrapped with [`create-next-app`](https://github.com/vercel/next.js/tree/canary/packages/create-next-app).
 2 | 
 3 | ## Getting Started
 4 | 
 5 | First, run the development server:
 6 | 
 7 | ```bash
 8 | npm run dev
 9 | # or
10 | yarn dev
11 | # or
12 | pnpm dev
13 | ```
14 | 
15 | Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
16 | 
17 | You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
18 | 
19 | This project uses [`next/font`](https://nextjs.org/docs/basic-features/font-optimization) to automatically optimize and load Inter, a custom Google Font.
20 | 
21 | ## Learn More
22 | 
23 | To learn more about Next.js, take a look at the following resources:
24 | 
25 | - [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
26 | - [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
27 | 
28 | You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js/) - your feedback and contributions are welcome!
29 | 
30 | ## Deploy on Vercel
31 | 
32 | The easiest way to deploy your Next.js app is to use the [Vercel Platform](https://vercel.com/new?utm_medium=default-template&filter=next.js&utm_source=create-next-app&utm_campaign=create-next-app-readme) from the creators of Next.js.
33 | 
34 | Check out our [Next.js deployment documentation](https://nextjs.org/docs/deployment) for more details.
35 | # threads-demon
36 | 


--------------------------------------------------------------------------------
/components.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "$schema": "https://ui.shadcn.com/schema.json",
 3 |   "style": "default",
 4 |   "rsc": true,
 5 |   "tsx": true,
 6 |   "tailwind": {
 7 |     "config": "tailwind.config.js",
 8 |     "css": "src/app/globals.css",
 9 |     "baseColor": "slate",
10 |     "cssVariables": true
11 |   },
12 |   "aliases": {
13 |     "components": "@/components",
14 |     "utils": "@/lib/utils"
15 |   }
16 | }


--------------------------------------------------------------------------------
/drizzle.config.ts:
--------------------------------------------------------------------------------
 1 | import type { Config } from "drizzle-kit";
 2 | import "dotenv/config";
 3 | 
 4 | export default {
 5 | 	schema: "./src/db/schema.ts",
 6 | 	driver: "pg",
 7 | 	out: "./drizzle",
 8 | 	dbCredentials: {
 9 | 		connectionString: process.env.DRIZZLE_DATABASE_URL!,
10 | 	},
11 | } satisfies Config;
12 | 


--------------------------------------------------------------------------------
/drizzle/0000_past_madripoor.sql:
--------------------------------------------------------------------------------
 1 | CREATE TABLE IF NOT EXISTS "account" (
 2 | 	"userId" text NOT NULL,
 3 | 	"type" text NOT NULL,
 4 | 	"provider" text NOT NULL,
 5 | 	"providerAccountId" text NOT NULL,
 6 | 	"refresh_token" text,
 7 | 	"access_token" text,
 8 | 	"expires_at" integer,
 9 | 	"token_type" text,
10 | 	"scope" text,
11 | 	"id_token" text,
12 | 	"session_state" text,
13 | 	CONSTRAINT account_provider_providerAccountId PRIMARY KEY("provider","providerAccountId")
14 | );
15 | --> statement-breakpoint
16 | CREATE TABLE IF NOT EXISTS "session" (
17 | 	"sessionToken" text PRIMARY KEY NOT NULL,
18 | 	"userId" text NOT NULL,
19 | 	"expires" timestamp NOT NULL
20 | );
21 | --> statement-breakpoint
22 | CREATE TABLE IF NOT EXISTS "user" (
23 | 	"id" text PRIMARY KEY NOT NULL,
24 | 	"name" text,
25 | 	"email" text NOT NULL,
26 | 	"emailVerified" timestamp,
27 | 	"image" text
28 | );
29 | --> statement-breakpoint
30 | CREATE TABLE IF NOT EXISTS "verificationToken" (
31 | 	"identifier" text NOT NULL,
32 | 	"token" text NOT NULL,
33 | 	"expires" timestamp NOT NULL,
34 | 	CONSTRAINT verificationToken_identifier_token PRIMARY KEY("identifier","token")
35 | );
36 | --> statement-breakpoint
37 | DO $$ BEGIN
38 |  ALTER TABLE "account" ADD CONSTRAINT "account_userId_user_id_fk" FOREIGN KEY ("userId") REFERENCES "user"("id") ON DELETE cascade ON UPDATE no action;
39 | EXCEPTION
40 |  WHEN duplicate_object THEN null;
41 | END $$;
42 | --> statement-breakpoint
43 | DO $$ BEGIN
44 |  ALTER TABLE "session" ADD CONSTRAINT "session_userId_user_id_fk" FOREIGN KEY ("userId") REFERENCES "user"("id") ON DELETE cascade ON UPDATE no action;
45 | EXCEPTION
46 |  WHEN duplicate_object THEN null;
47 | END $$;
48 | 


--------------------------------------------------------------------------------
/drizzle/0001_round_hammerhead.sql:
--------------------------------------------------------------------------------
1 | ALTER TABLE "user" ADD COLUMN "username" text;--> statement-breakpoint
2 | ALTER TABLE "user" ADD CONSTRAINT "user_username_unique" UNIQUE("username");


--------------------------------------------------------------------------------
/drizzle/0002_kind_ultragirl.sql:
--------------------------------------------------------------------------------
1 | CREATE TABLE IF NOT EXISTS "thread" (
2 | 	"id" uuid PRIMARY KEY DEFAULT gen_random_uuid() NOT NULL,
3 | 	"text" text NOT NULL,
4 | 	"user_id" text NOT NULL,
5 | 	"created_at" timestamp DEFAULT now(),
6 | 	"parent_id" text,
7 | 	"dialogue_id" uuid
8 | );
9 | 


--------------------------------------------------------------------------------
/drizzle/meta/0000_snapshot.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "version": "5",
  3 |   "dialect": "pg",
  4 |   "id": "7288581e-7590-4449-aef0-ad7b7849a93e",
  5 |   "prevId": "00000000-0000-0000-0000-000000000000",
  6 |   "tables": {
  7 |     "account": {
  8 |       "name": "account",
  9 |       "schema": "",
 10 |       "columns": {
 11 |         "userId": {
 12 |           "name": "userId",
 13 |           "type": "text",
 14 |           "primaryKey": false,
 15 |           "notNull": true
 16 |         },
 17 |         "type": {
 18 |           "name": "type",
 19 |           "type": "text",
 20 |           "primaryKey": false,
 21 |           "notNull": true
 22 |         },
 23 |         "provider": {
 24 |           "name": "provider",
 25 |           "type": "text",
 26 |           "primaryKey": false,
 27 |           "notNull": true
 28 |         },
 29 |         "providerAccountId": {
 30 |           "name": "providerAccountId",
 31 |           "type": "text",
 32 |           "primaryKey": false,
 33 |           "notNull": true
 34 |         },
 35 |         "refresh_token": {
 36 |           "name": "refresh_token",
 37 |           "type": "text",
 38 |           "primaryKey": false,
 39 |           "notNull": false
 40 |         },
 41 |         "access_token": {
 42 |           "name": "access_token",
 43 |           "type": "text",
 44 |           "primaryKey": false,
 45 |           "notNull": false
 46 |         },
 47 |         "expires_at": {
 48 |           "name": "expires_at",
 49 |           "type": "integer",
 50 |           "primaryKey": false,
 51 |           "notNull": false
 52 |         },
 53 |         "token_type": {
 54 |           "name": "token_type",
 55 |           "type": "text",
 56 |           "primaryKey": false,
 57 |           "notNull": false
 58 |         },
 59 |         "scope": {
 60 |           "name": "scope",
 61 |           "type": "text",
 62 |           "primaryKey": false,
 63 |           "notNull": false
 64 |         },
 65 |         "id_token": {
 66 |           "name": "id_token",
 67 |           "type": "text",
 68 |           "primaryKey": false,
 69 |           "notNull": false
 70 |         },
 71 |         "session_state": {
 72 |           "name": "session_state",
 73 |           "type": "text",
 74 |           "primaryKey": false,
 75 |           "notNull": false
 76 |         }
 77 |       },
 78 |       "indexes": {},
 79 |       "foreignKeys": {
 80 |         "account_userId_user_id_fk": {
 81 |           "name": "account_userId_user_id_fk",
 82 |           "tableFrom": "account",
 83 |           "tableTo": "user",
 84 |           "columnsFrom": [
 85 |             "userId"
 86 |           ],
 87 |           "columnsTo": [
 88 |             "id"
 89 |           ],
 90 |           "onDelete": "cascade",
 91 |           "onUpdate": "no action"
 92 |         }
 93 |       },
 94 |       "compositePrimaryKeys": {
 95 |         "account_provider_providerAccountId": {
 96 |           "name": "account_provider_providerAccountId",
 97 |           "columns": [
 98 |             "provider",
 99 |             "providerAccountId"
100 |           ]
101 |         }
102 |       },
103 |       "uniqueConstraints": {}
104 |     },
105 |     "session": {
106 |       "name": "session",
107 |       "schema": "",
108 |       "columns": {
109 |         "sessionToken": {
110 |           "name": "sessionToken",
111 |           "type": "text",
112 |           "primaryKey": true,
113 |           "notNull": true
114 |         },
115 |         "userId": {
116 |           "name": "userId",
117 |           "type": "text",
118 |           "primaryKey": false,
119 |           "notNull": true
120 |         },
121 |         "expires": {
122 |           "name": "expires",
123 |           "type": "timestamp",
124 |           "primaryKey": false,
125 |           "notNull": true
126 |         }
127 |       },
128 |       "indexes": {},
129 |       "foreignKeys": {
130 |         "session_userId_user_id_fk": {
131 |           "name": "session_userId_user_id_fk",
132 |           "tableFrom": "session",
133 |           "tableTo": "user",
134 |           "columnsFrom": [
135 |             "userId"
136 |           ],
137 |           "columnsTo": [
138 |             "id"
139 |           ],
140 |           "onDelete": "cascade",
141 |           "onUpdate": "no action"
142 |         }
143 |       },
144 |       "compositePrimaryKeys": {},
145 |       "uniqueConstraints": {}
146 |     },
147 |     "user": {
148 |       "name": "user",
149 |       "schema": "",
150 |       "columns": {
151 |         "id": {
152 |           "name": "id",
153 |           "type": "text",
154 |           "primaryKey": true,
155 |           "notNull": true
156 |         },
157 |         "name": {
158 |           "name": "name",
159 |           "type": "text",
160 |           "primaryKey": false,
161 |           "notNull": false
162 |         },
163 |         "email": {
164 |           "name": "email",
165 |           "type": "text",
166 |           "primaryKey": false,
167 |           "notNull": true
168 |         },
169 |         "emailVerified": {
170 |           "name": "emailVerified",
171 |           "type": "timestamp",
172 |           "primaryKey": false,
173 |           "notNull": false
174 |         },
175 |         "image": {
176 |           "name": "image",
177 |           "type": "text",
178 |           "primaryKey": false,
179 |           "notNull": false
180 |         }
181 |       },
182 |       "indexes": {},
183 |       "foreignKeys": {},
184 |       "compositePrimaryKeys": {},
185 |       "uniqueConstraints": {}
186 |     },
187 |     "verificationToken": {
188 |       "name": "verificationToken",
189 |       "schema": "",
190 |       "columns": {
191 |         "identifier": {
192 |           "name": "identifier",
193 |           "type": "text",
194 |           "primaryKey": false,
195 |           "notNull": true
196 |         },
197 |         "token": {
198 |           "name": "token",
199 |           "type": "text",
200 |           "primaryKey": false,
201 |           "notNull": true
202 |         },
203 |         "expires": {
204 |           "name": "expires",
205 |           "type": "timestamp",
206 |           "primaryKey": false,
207 |           "notNull": true
208 |         }
209 |       },
210 |       "indexes": {},
211 |       "foreignKeys": {},
212 |       "compositePrimaryKeys": {
213 |         "verificationToken_identifier_token": {
214 |           "name": "verificationToken_identifier_token",
215 |           "columns": [
216 |             "identifier",
217 |             "token"
218 |           ]
219 |         }
220 |       },
221 |       "uniqueConstraints": {}
222 |     }
223 |   },
224 |   "enums": {},
225 |   "schemas": {},
226 |   "_meta": {
227 |     "schemas": {},
228 |     "tables": {},
229 |     "columns": {}
230 |   }
231 | }


--------------------------------------------------------------------------------
/drizzle/meta/0001_snapshot.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "version": "5",
  3 |   "dialect": "pg",
  4 |   "id": "8d6baaaf-a390-43c2-997c-315a78a9f107",
  5 |   "prevId": "7288581e-7590-4449-aef0-ad7b7849a93e",
  6 |   "tables": {
  7 |     "account": {
  8 |       "name": "account",
  9 |       "schema": "",
 10 |       "columns": {
 11 |         "userId": {
 12 |           "name": "userId",
 13 |           "type": "text",
 14 |           "primaryKey": false,
 15 |           "notNull": true
 16 |         },
 17 |         "type": {
 18 |           "name": "type",
 19 |           "type": "text",
 20 |           "primaryKey": false,
 21 |           "notNull": true
 22 |         },
 23 |         "provider": {
 24 |           "name": "provider",
 25 |           "type": "text",
 26 |           "primaryKey": false,
 27 |           "notNull": true
 28 |         },
 29 |         "providerAccountId": {
 30 |           "name": "providerAccountId",
 31 |           "type": "text",
 32 |           "primaryKey": false,
 33 |           "notNull": true
 34 |         },
 35 |         "refresh_token": {
 36 |           "name": "refresh_token",
 37 |           "type": "text",
 38 |           "primaryKey": false,
 39 |           "notNull": false
 40 |         },
 41 |         "access_token": {
 42 |           "name": "access_token",
 43 |           "type": "text",
 44 |           "primaryKey": false,
 45 |           "notNull": false
 46 |         },
 47 |         "expires_at": {
 48 |           "name": "expires_at",
 49 |           "type": "integer",
 50 |           "primaryKey": false,
 51 |           "notNull": false
 52 |         },
 53 |         "token_type": {
 54 |           "name": "token_type",
 55 |           "type": "text",
 56 |           "primaryKey": false,
 57 |           "notNull": false
 58 |         },
 59 |         "scope": {
 60 |           "name": "scope",
 61 |           "type": "text",
 62 |           "primaryKey": false,
 63 |           "notNull": false
 64 |         },
 65 |         "id_token": {
 66 |           "name": "id_token",
 67 |           "type": "text",
 68 |           "primaryKey": false,
 69 |           "notNull": false
 70 |         },
 71 |         "session_state": {
 72 |           "name": "session_state",
 73 |           "type": "text",
 74 |           "primaryKey": false,
 75 |           "notNull": false
 76 |         }
 77 |       },
 78 |       "indexes": {},
 79 |       "foreignKeys": {
 80 |         "account_userId_user_id_fk": {
 81 |           "name": "account_userId_user_id_fk",
 82 |           "tableFrom": "account",
 83 |           "tableTo": "user",
 84 |           "columnsFrom": [
 85 |             "userId"
 86 |           ],
 87 |           "columnsTo": [
 88 |             "id"
 89 |           ],
 90 |           "onDelete": "cascade",
 91 |           "onUpdate": "no action"
 92 |         }
 93 |       },
 94 |       "compositePrimaryKeys": {
 95 |         "account_provider_providerAccountId": {
 96 |           "name": "account_provider_providerAccountId",
 97 |           "columns": [
 98 |             "provider",
 99 |             "providerAccountId"
100 |           ]
101 |         }
102 |       },
103 |       "uniqueConstraints": {}
104 |     },
105 |     "session": {
106 |       "name": "session",
107 |       "schema": "",
108 |       "columns": {
109 |         "sessionToken": {
110 |           "name": "sessionToken",
111 |           "type": "text",
112 |           "primaryKey": true,
113 |           "notNull": true
114 |         },
115 |         "userId": {
116 |           "name": "userId",
117 |           "type": "text",
118 |           "primaryKey": false,
119 |           "notNull": true
120 |         },
121 |         "expires": {
122 |           "name": "expires",
123 |           "type": "timestamp",
124 |           "primaryKey": false,
125 |           "notNull": true
126 |         }
127 |       },
128 |       "indexes": {},
129 |       "foreignKeys": {
130 |         "session_userId_user_id_fk": {
131 |           "name": "session_userId_user_id_fk",
132 |           "tableFrom": "session",
133 |           "tableTo": "user",
134 |           "columnsFrom": [
135 |             "userId"
136 |           ],
137 |           "columnsTo": [
138 |             "id"
139 |           ],
140 |           "onDelete": "cascade",
141 |           "onUpdate": "no action"
142 |         }
143 |       },
144 |       "compositePrimaryKeys": {},
145 |       "uniqueConstraints": {}
146 |     },
147 |     "user": {
148 |       "name": "user",
149 |       "schema": "",
150 |       "columns": {
151 |         "id": {
152 |           "name": "id",
153 |           "type": "text",
154 |           "primaryKey": true,
155 |           "notNull": true
156 |         },
157 |         "name": {
158 |           "name": "name",
159 |           "type": "text",
160 |           "primaryKey": false,
161 |           "notNull": false
162 |         },
163 |         "email": {
164 |           "name": "email",
165 |           "type": "text",
166 |           "primaryKey": false,
167 |           "notNull": true
168 |         },
169 |         "emailVerified": {
170 |           "name": "emailVerified",
171 |           "type": "timestamp",
172 |           "primaryKey": false,
173 |           "notNull": false
174 |         },
175 |         "image": {
176 |           "name": "image",
177 |           "type": "text",
178 |           "primaryKey": false,
179 |           "notNull": false
180 |         },
181 |         "username": {
182 |           "name": "username",
183 |           "type": "text",
184 |           "primaryKey": false,
185 |           "notNull": false
186 |         }
187 |       },
188 |       "indexes": {},
189 |       "foreignKeys": {},
190 |       "compositePrimaryKeys": {},
191 |       "uniqueConstraints": {
192 |         "user_username_unique": {
193 |           "name": "user_username_unique",
194 |           "nullsNotDistinct": false,
195 |           "columns": [
196 |             "username"
197 |           ]
198 |         }
199 |       }
200 |     },
201 |     "verificationToken": {
202 |       "name": "verificationToken",
203 |       "schema": "",
204 |       "columns": {
205 |         "identifier": {
206 |           "name": "identifier",
207 |           "type": "text",
208 |           "primaryKey": false,
209 |           "notNull": true
210 |         },
211 |         "token": {
212 |           "name": "token",
213 |           "type": "text",
214 |           "primaryKey": false,
215 |           "notNull": true
216 |         },
217 |         "expires": {
218 |           "name": "expires",
219 |           "type": "timestamp",
220 |           "primaryKey": false,
221 |           "notNull": true
222 |         }
223 |       },
224 |       "indexes": {},
225 |       "foreignKeys": {},
226 |       "compositePrimaryKeys": {
227 |         "verificationToken_identifier_token": {
228 |           "name": "verificationToken_identifier_token",
229 |           "columns": [
230 |             "identifier",
231 |             "token"
232 |           ]
233 |         }
234 |       },
235 |       "uniqueConstraints": {}
236 |     }
237 |   },
238 |   "enums": {},
239 |   "schemas": {},
240 |   "_meta": {
241 |     "schemas": {},
242 |     "tables": {},
243 |     "columns": {}
244 |   }
245 | }


--------------------------------------------------------------------------------
/drizzle/meta/0002_snapshot.json:
--------------------------------------------------------------------------------
  1 | {
  2 |   "version": "5",
  3 |   "dialect": "pg",
  4 |   "id": "e24cce00-d88b-4aa5-85ad-f64935418b31",
  5 |   "prevId": "8d6baaaf-a390-43c2-997c-315a78a9f107",
  6 |   "tables": {
  7 |     "account": {
  8 |       "name": "account",
  9 |       "schema": "",
 10 |       "columns": {
 11 |         "userId": {
 12 |           "name": "userId",
 13 |           "type": "text",
 14 |           "primaryKey": false,
 15 |           "notNull": true
 16 |         },
 17 |         "type": {
 18 |           "name": "type",
 19 |           "type": "text",
 20 |           "primaryKey": false,
 21 |           "notNull": true
 22 |         },
 23 |         "provider": {
 24 |           "name": "provider",
 25 |           "type": "text",
 26 |           "primaryKey": false,
 27 |           "notNull": true
 28 |         },
 29 |         "providerAccountId": {
 30 |           "name": "providerAccountId",
 31 |           "type": "text",
 32 |           "primaryKey": false,
 33 |           "notNull": true
 34 |         },
 35 |         "refresh_token": {
 36 |           "name": "refresh_token",
 37 |           "type": "text",
 38 |           "primaryKey": false,
 39 |           "notNull": false
 40 |         },
 41 |         "access_token": {
 42 |           "name": "access_token",
 43 |           "type": "text",
 44 |           "primaryKey": false,
 45 |           "notNull": false
 46 |         },
 47 |         "expires_at": {
 48 |           "name": "expires_at",
 49 |           "type": "integer",
 50 |           "primaryKey": false,
 51 |           "notNull": false
 52 |         },
 53 |         "token_type": {
 54 |           "name": "token_type",
 55 |           "type": "text",
 56 |           "primaryKey": false,
 57 |           "notNull": false
 58 |         },
 59 |         "scope": {
 60 |           "name": "scope",
 61 |           "type": "text",
 62 |           "primaryKey": false,
 63 |           "notNull": false
 64 |         },
 65 |         "id_token": {
 66 |           "name": "id_token",
 67 |           "type": "text",
 68 |           "primaryKey": false,
 69 |           "notNull": false
 70 |         },
 71 |         "session_state": {
 72 |           "name": "session_state",
 73 |           "type": "text",
 74 |           "primaryKey": false,
 75 |           "notNull": false
 76 |         }
 77 |       },
 78 |       "indexes": {},
 79 |       "foreignKeys": {
 80 |         "account_userId_user_id_fk": {
 81 |           "name": "account_userId_user_id_fk",
 82 |           "tableFrom": "account",
 83 |           "tableTo": "user",
 84 |           "columnsFrom": [
 85 |             "userId"
 86 |           ],
 87 |           "columnsTo": [
 88 |             "id"
 89 |           ],
 90 |           "onDelete": "cascade",
 91 |           "onUpdate": "no action"
 92 |         }
 93 |       },
 94 |       "compositePrimaryKeys": {
 95 |         "account_provider_providerAccountId": {
 96 |           "name": "account_provider_providerAccountId",
 97 |           "columns": [
 98 |             "provider",
 99 |             "providerAccountId"
100 |           ]
101 |         }
102 |       },
103 |       "uniqueConstraints": {}
104 |     },
105 |     "session": {
106 |       "name": "session",
107 |       "schema": "",
108 |       "columns": {
109 |         "sessionToken": {
110 |           "name": "sessionToken",
111 |           "type": "text",
112 |           "primaryKey": true,
113 |           "notNull": true
114 |         },
115 |         "userId": {
116 |           "name": "userId",
117 |           "type": "text",
118 |           "primaryKey": false,
119 |           "notNull": true
120 |         },
121 |         "expires": {
122 |           "name": "expires",
123 |           "type": "timestamp",
124 |           "primaryKey": false,
125 |           "notNull": true
126 |         }
127 |       },
128 |       "indexes": {},
129 |       "foreignKeys": {
130 |         "session_userId_user_id_fk": {
131 |           "name": "session_userId_user_id_fk",
132 |           "tableFrom": "session",
133 |           "tableTo": "user",
134 |           "columnsFrom": [
135 |             "userId"
136 |           ],
137 |           "columnsTo": [
138 |             "id"
139 |           ],
140 |           "onDelete": "cascade",
141 |           "onUpdate": "no action"
142 |         }
143 |       },
144 |       "compositePrimaryKeys": {},
145 |       "uniqueConstraints": {}
146 |     },
147 |     "thread": {
148 |       "name": "thread",
149 |       "schema": "",
150 |       "columns": {
151 |         "id": {
152 |           "name": "id",
153 |           "type": "uuid",
154 |           "primaryKey": true,
155 |           "notNull": true,
156 |           "default": "gen_random_uuid()"
157 |         },
158 |         "text": {
159 |           "name": "text",
160 |           "type": "text",
161 |           "primaryKey": false,
162 |           "notNull": true
163 |         },
164 |         "user_id": {
165 |           "name": "user_id",
166 |           "type": "text",
167 |           "primaryKey": false,
168 |           "notNull": true
169 |         },
170 |         "created_at": {
171 |           "name": "created_at",
172 |           "type": "timestamp",
173 |           "primaryKey": false,
174 |           "notNull": false,
175 |           "default": "now()"
176 |         },
177 |         "parent_id": {
178 |           "name": "parent_id",
179 |           "type": "text",
180 |           "primaryKey": false,
181 |           "notNull": false
182 |         },
183 |         "dialogue_id": {
184 |           "name": "dialogue_id",
185 |           "type": "uuid",
186 |           "primaryKey": false,
187 |           "notNull": false
188 |         }
189 |       },
190 |       "indexes": {},
191 |       "foreignKeys": {},
192 |       "compositePrimaryKeys": {},
193 |       "uniqueConstraints": {}
194 |     },
195 |     "user": {
196 |       "name": "user",
197 |       "schema": "",
198 |       "columns": {
199 |         "id": {
200 |           "name": "id",
201 |           "type": "text",
202 |           "primaryKey": true,
203 |           "notNull": true
204 |         },
205 |         "name": {
206 |           "name": "name",
207 |           "type": "text",
208 |           "primaryKey": false,
209 |           "notNull": false
210 |         },
211 |         "email": {
212 |           "name": "email",
213 |           "type": "text",
214 |           "primaryKey": false,
215 |           "notNull": true
216 |         },
217 |         "emailVerified": {
218 |           "name": "emailVerified",
219 |           "type": "timestamp",
220 |           "primaryKey": false,
221 |           "notNull": false
222 |         },
223 |         "image": {
224 |           "name": "image",
225 |           "type": "text",
226 |           "primaryKey": false,
227 |           "notNull": false
228 |         },
229 |         "username": {
230 |           "name": "username",
231 |           "type": "text",
232 |           "primaryKey": false,
233 |           "notNull": false
234 |         }
235 |       },
236 |       "indexes": {},
237 |       "foreignKeys": {},
238 |       "compositePrimaryKeys": {},
239 |       "uniqueConstraints": {
240 |         "user_username_unique": {
241 |           "name": "user_username_unique",
242 |           "nullsNotDistinct": false,
243 |           "columns": [
244 |             "username"
245 |           ]
246 |         }
247 |       }
248 |     },
249 |     "verificationToken": {
250 |       "name": "verificationToken",
251 |       "schema": "",
252 |       "columns": {
253 |         "identifier": {
254 |           "name": "identifier",
255 |           "type": "text",
256 |           "primaryKey": false,
257 |           "notNull": true
258 |         },
259 |         "token": {
260 |           "name": "token",
261 |           "type": "text",
262 |           "primaryKey": false,
263 |           "notNull": true
264 |         },
265 |         "expires": {
266 |           "name": "expires",
267 |           "type": "timestamp",
268 |           "primaryKey": false,
269 |           "notNull": true
270 |         }
271 |       },
272 |       "indexes": {},
273 |       "foreignKeys": {},
274 |       "compositePrimaryKeys": {
275 |         "verificationToken_identifier_token": {
276 |           "name": "verificationToken_identifier_token",
277 |           "columns": [
278 |             "identifier",
279 |             "token"
280 |           ]
281 |         }
282 |       },
283 |       "uniqueConstraints": {}
284 |     }
285 |   },
286 |   "enums": {},
287 |   "schemas": {},
288 |   "_meta": {
289 |     "schemas": {},
290 |     "tables": {},
291 |     "columns": {}
292 |   }
293 | }


--------------------------------------------------------------------------------
/drizzle/meta/_journal.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "version": "5",
 3 |   "dialect": "pg",
 4 |   "entries": [
 5 |     {
 6 |       "idx": 0,
 7 |       "version": "5",
 8 |       "when": 1692008223015,
 9 |       "tag": "0000_past_madripoor",
10 |       "breakpoints": true
11 |     },
12 |     {
13 |       "idx": 1,
14 |       "version": "5",
15 |       "when": 1692081127736,
16 |       "tag": "0001_round_hammerhead",
17 |       "breakpoints": true
18 |     },
19 |     {
20 |       "idx": 2,
21 |       "version": "5",
22 |       "when": 1692348935935,
23 |       "tag": "0002_kind_ultragirl",
24 |       "breakpoints": true
25 |     }
26 |   ]
27 | }


--------------------------------------------------------------------------------
/next.config.js:
--------------------------------------------------------------------------------
 1 | /** @type {import('next').NextConfig} */
 2 | const nextConfig = {
 3 |   images: {
 4 |     domains: ['lh3.googleusercontent.com', "icon-library.com"],
 5 |   },
 6 |   experimental: {
 7 |     serverActions: true,
 8 |   },
 9 | }
10 | 
11 | module.exports = nextConfig
12 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "threads-clone-demon",
 3 |   "version": "0.1.0",
 4 |   "private": true,
 5 |   "scripts": {
 6 |     "dev": "next dev",
 7 |     "build": "next build",
 8 |     "start": "next start",
 9 |     "lint": "next lint",
10 |     "db:generate": "drizzle-kit generate:pg",
11 |     "db:push": "drizzle-kit push:pg",
12 |     "db:introspect": "drizzle-kit introspect:pg"
13 |   },
14 |   "dependencies": {
15 |     "@auth/drizzle-adapter": "^0.3.1",
16 |     "@hookform/resolvers": "^3.2.0",
17 |     "@neondatabase/serverless": "^0.5.7",
18 |     "@radix-ui/react-dialog": "^1.0.4",
19 |     "@radix-ui/react-dropdown-menu": "^2.0.5",
20 |     "@radix-ui/react-icons": "^1.3.0",
21 |     "@radix-ui/react-label": "^2.0.2",
22 |     "@radix-ui/react-slot": "^1.0.2",
23 |     "@radix-ui/react-toast": "^1.1.4",
24 |     "@types/node": "20.5.0",
25 |     "@types/react": "18.2.20",
26 |     "@types/react-dom": "18.2.7",
27 |     "@types/uuid": "^9.0.2",
28 |     "autoprefixer": "10.4.15",
29 |     "class-variance-authority": "^0.7.0",
30 |     "clsx": "^2.0.0",
31 |     "dotenv": "^16.3.1",
32 |     "drizzle-orm": "^0.28.2",
33 |     "eslint": "8.47.0",
34 |     "eslint-config-next": "13.4.13",
35 |     "framer-motion": "^10.16.0",
36 |     "lucide-react": "^0.263.1",
37 |     "nanoid": "^4.0.2",
38 |     "next": "13.4.14-canary.0",
39 |     "next-auth": "^4.23.0",
40 |     "next-themes": "^0.2.1",
41 |     "postcss": "8.4.27",
42 |     "react": "18.2.0",
43 |     "react-dom": "18.2.0",
44 |     "react-hook-form": "^7.45.4",
45 |     "react-icons": "^4.10.1",
46 |     "react-textarea-autosize": "^8.5.2",
47 |     "sonner": "^0.6.2",
48 |     "tailwind-merge": "^1.14.0",
49 |     "tailwindcss": "3.3.3",
50 |     "tailwindcss-animate": "^1.0.6",
51 |     "typescript": "5.1.6",
52 |     "uuid": "^9.0.0",
53 |     "zod": "^3.22.1",
54 |     "zustand": "^4.4.1"
55 |   },
56 |   "devDependencies": {
57 |     "drizzle-kit": "^0.19.12"
58 |   }
59 | }
60 | 


--------------------------------------------------------------------------------
/postcss.config.js:
--------------------------------------------------------------------------------
1 | module.exports = {
2 |   plugins: {
3 |     tailwindcss: {},
4 |     autoprefixer: {},
5 |   },
6 | }
7 | 


--------------------------------------------------------------------------------
/public/next.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 394 80"><path fill="#000" d="M262 0h68.5v12.7h-27.2v66.6h-13.6V12.7H262V0ZM149 0v12.7H94v20.4h44.3v12.6H94v21h55v12.6H80.5V0h68.7zm34.3 0h-17.8l63.8 79.4h17.9l-32-39.7 32-39.6h-17.9l-23 28.6-23-28.6zm18.3 56.7-9-11-27.1 33.7h17.8l18.3-22.7z"/><path fill="#000" d="M81 79.3 17 0H0v79.3h13.6V17l50.2 62.3H81Zm252.6-.4c-1 0-1.8-.4-2.5-1s-1.1-1.6-1.1-2.6.3-1.8 1-2.5 1.6-1 2.6-1 1.8.3 2.5 1a3.4 3.4 0 0 1 .6 4.3 3.7 3.7 0 0 1-3 1.8zm23.2-33.5h6v23.3c0 2.1-.4 4-1.3 5.5a9.1 9.1 0 0 1-3.8 3.5c-1.6.8-3.5 1.3-5.7 1.3-2 0-3.7-.4-5.3-1s-2.8-1.8-3.7-3.2c-.9-1.3-1.4-3-1.4-5h6c.1.8.3 1.6.7 2.2s1 1.2 1.6 1.5c.7.4 1.5.5 2.4.5 1 0 1.8-.2 2.4-.6a4 4 0 0 0 1.6-1.8c.3-.8.5-1.8.5-3V45.5zm30.9 9.1a4.4 4.4 0 0 0-2-3.3 7.5 7.5 0 0 0-4.3-1.1c-1.3 0-2.4.2-3.3.5-.9.4-1.6 1-2 1.6a3.5 3.5 0 0 0-.3 4c.3.5.7.9 1.3 1.2l1.8 1 2 .5 3.2.8c1.3.3 2.5.7 3.7 1.2a13 13 0 0 1 3.2 1.8 8.1 8.1 0 0 1 3 6.5c0 2-.5 3.7-1.5 5.1a10 10 0 0 1-4.4 3.5c-1.8.8-4.1 1.2-6.8 1.2-2.6 0-4.9-.4-6.8-1.2-2-.8-3.4-2-4.5-3.5a10 10 0 0 1-1.7-5.6h6a5 5 0 0 0 3.5 4.6c1 .4 2.2.6 3.4.6 1.3 0 2.5-.2 3.5-.6 1-.4 1.8-1 2.4-1.7a4 4 0 0 0 .8-2.4c0-.9-.2-1.6-.7-2.2a11 11 0 0 0-2.1-1.4l-3.2-1-3.8-1c-2.8-.7-5-1.7-6.6-3.2a7.2 7.2 0 0 1-2.4-5.7 8 8 0 0 1 1.7-5 10 10 0 0 1 4.3-3.5c2-.8 4-1.2 6.4-1.2 2.3 0 4.4.4 6.2 1.2 1.8.8 3.2 2 4.3 3.4 1 1.4 1.5 3 1.5 5h-5.8z"/></svg>


--------------------------------------------------------------------------------
/public/vercel.svg:
--------------------------------------------------------------------------------
1 | <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 283 64"><path fill="black" d="M141 16c-11 0-19 7-19 18s9 18 20 18c7 0 13-3 16-7l-7-5c-2 3-6 4-9 4-5 0-9-3-10-7h28v-3c0-11-8-18-19-18zm-9 15c1-4 4-7 9-7s8 3 9 7h-18zm117-15c-11 0-19 7-19 18s9 18 20 18c6 0 12-3 16-7l-8-5c-2 3-5 4-8 4-5 0-9-3-11-7h28l1-3c0-11-8-18-19-18zm-10 15c2-4 5-7 10-7s8 3 9 7h-19zm-39 3c0 6 4 10 10 10 4 0 7-2 9-5l8 5c-3 5-9 8-17 8-11 0-19-7-19-18s8-18 19-18c8 0 14 3 17 8l-8 5c-2-3-5-5-9-5-6 0-10 4-10 10zm83-29v46h-9V5h9zM37 0l37 64H0L37 0zm92 5-27 48L74 5h10l18 30 17-30h10zm59 12v10l-3-1c-6 0-10 4-10 10v15h-9V17h9v9c0-5 6-9 13-9z"/></svg>


--------------------------------------------------------------------------------
/src/app/_actions/thread.ts:
--------------------------------------------------------------------------------
  1 | "use server";
  2 | import { db } from "@/db";
  3 | import { v4 as uuidv4 } from "uuid";
  4 | import { getAuthSession } from "@/lib/auth";
  5 | import { addThreadsSchema } from "@/validations/thread";
  6 | import { z } from "zod";
  7 | import { Thread, threads } from "@/db/schema";
  8 | import { revalidatePath } from "next/cache";
  9 | import { and, eq, inArray, isNull, not } from "drizzle-orm";
 10 | import { get } from "http";
 11 | export async function addThreadsAction(
 12 | 	input: z.infer<typeof addThreadsSchema>
 13 | ) {
 14 | 	const session = await getAuthSession();
 15 | 	if (!session) return Error("Not logged in");
 16 | 	const uuids = getUuidsFromLength(input.threads.length);
 17 | 	type ThreadNew = Omit<Thread, "createdAt">;
 18 | 	const result_threads: Omit<ThreadNew[], "created_at"> = [];
 19 | 	input.threads.forEach((thread, i) => {
 20 | 		result_threads.push({
 21 | 			id: uuids[i],
 22 | 			text: thread.text,
 23 | 			userId: session.user.id,
 24 | 			parentId: uuids[i - 1] || null,
 25 | 			dialogue_id: thread.dialogueId,
 26 | 		});
 27 | 	});
 28 | 	console.log(result_threads);
 29 | 	await db.insert(threads).values(result_threads);
 30 | 	revalidatePath("/");
 31 | }
 32 | 
 33 | function getUuidsFromLength(length: number) {
 34 | 	return Array.from({ length }, () => uuidv4());
 35 | }
 36 | 
 37 | export async function getFeedAction() {
 38 | 	const results = await db.query.threads.findMany({
 39 | 		where: isNull(threads.parentId),
 40 | 		with: {
 41 | 			user: {
 42 | 				columns: {
 43 | 					username: true,
 44 | 					image: true,
 45 | 					id: true,
 46 | 				},
 47 | 			},
 48 | 		},
 49 | 	});
 50 | 	return results;
 51 | }
 52 | export async function getDialogueForThread(id: string) {
 53 | 	const thread = await db.query.threads.findFirst({
 54 | 		where: eq(threads.id, id),
 55 | 		with: {
 56 | 			user: {
 57 | 				columns: {
 58 | 					id: true,
 59 | 					username: true,
 60 | 					image: true,
 61 | 				},
 62 | 			},
 63 | 		},
 64 | 	});
 65 | 	if (!thread) throw Error("No thread found");
 66 | 	const dialogue_id = thread?.dialogue_id;
 67 | 	if (!dialogue_id) throw new Error("No dialogue id found");
 68 | 	const dialogue = await db.query.threads.findMany({
 69 | 		where: and(
 70 | 			eq(threads.dialogue_id, dialogue_id),
 71 | 			not(eq(threads.id, id))
 72 | 		),
 73 | 		with: {
 74 | 			user: {
 75 | 				columns: {
 76 | 					id: true,
 77 | 					username: true,
 78 | 					image: true,
 79 | 				},
 80 | 			},
 81 | 		},
 82 | 	});
 83 | 
 84 | 	const ordered_threads = [thread];
 85 | 
 86 | 	const parentId_to_thread = new Map<string, typeof thread>();
 87 | 
 88 | 	dialogue.forEach((thread) => {
 89 | 		parentId_to_thread.set(thread.parentId!, thread);
 90 | 	});
 91 | 
 92 | 	let current_thread_parent_id = thread.id;
 93 | 	while (current_thread_parent_id) {
 94 | 		const current_thread = parentId_to_thread.get(current_thread_parent_id);
 95 | 		if (!current_thread) break;
 96 | 		ordered_threads.push(current_thread);
 97 | 		parentId_to_thread.delete(current_thread_parent_id);
 98 | 		current_thread_parent_id = current_thread.id;
 99 | 	}
100 | 	return ordered_threads;
101 | }
102 | export const deleteThreadAction = async (id: string) => {
103 | 	const session = await getAuthSession();
104 | 	if (!session) return Error("Not logged in");
105 | 	const dialogue = await getDialogueForThread(id);
106 | 	await db.delete(threads).where(
107 | 		inArray(
108 | 			threads.id,
109 | 			dialogue.map((t) => t.id)
110 | 		)
111 | 	);
112 | 	revalidatePath("/");
113 | 	revalidatePath(`/dialogue/${id}`);
114 | };
115 | 


--------------------------------------------------------------------------------
/src/app/api/auth/[...nextauth]/route.ts:
--------------------------------------------------------------------------------
1 | import { authOptions } from "@/lib/auth"
2 | import NextAuth from "next-auth"
3 | 
4 | const handler = NextAuth(authOptions)
5 | 
6 | export { handler as GET, handler as POST }


--------------------------------------------------------------------------------
/src/app/dialogue/[id]/page.tsx:
--------------------------------------------------------------------------------
 1 | import { getDialogueForThread } from "@/app/_actions/thread";
 2 | import { RepliesComponent } from "@/components/client/RepliesComponent";
 3 | import Image from "next/image";
 4 | 
 5 | const page = async ({
 6 | 	params,
 7 | }: {
 8 | 	params: {
 9 | 		id: string;
10 | 	};
11 | }) => {
12 | 	const threads_data = await getDialogueForThread(params.id);
13 | 	const main_thread = threads_data[0];
14 | 	const replies = threads_data.slice(1);
15 | 	return (
16 | 		<div>
17 | 			<div>
18 | 				<div className="flex flex-col gap-4 items-start pt-6 px-4 h-32">
19 | 					<div className="flex gap-3 items-center">
20 | 						<Image
21 | 							className="rounded-full w-8 h-8"
22 | 							width={50}
23 | 							height={50}
24 | 							alt="profile_pic"
25 | 							src={
26 | 								main_thread?.user?.image ??
27 | 								"https://icon-library.com/images/default-user-icon/default-user-icon-8.jpg"
28 | 							}
29 | 						/>
30 | 						<p className="text-sm font-semibold">
31 | 							@{main_thread?.user?.username}
32 | 						</p>
33 | 					</div>
34 | 					<div>
35 | 						<p className="text-lg">{main_thread?.text}</p>
36 | 					</div>
37 | 				</div>
38 | 			</div>
39 | 			{replies.length > 1 && (
40 | 				<div className="flex flex-col border-y-[1px] py-4">
41 | 					{replies.map((message, index) => {
42 | 						return (
43 | 							<RepliesComponent
44 | 								index={index}
45 | 								length={replies.length}
46 | 								key={message.id}
47 | 								id={message.id}
48 | 								username={message.user.username ?? ""}
49 | 								image={
50 | 									message.user.image ??
51 | 									"https://icon-library.com/images/default-user-icon/default-user-icon-8.jpg"
52 | 								}
53 | 								text={message.text}
54 | 							/>
55 | 						);
56 | 					})}
57 | 				</div>
58 | 			)}
59 | 		</div>
60 | 	);
61 | };
62 | 
63 | export default page;
64 | 


--------------------------------------------------------------------------------
/src/app/favicon.ico:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/kshitijmohan15/threads-demon/c98d1cb150e83c8dbe050000c8636acb9280bcee/src/app/favicon.ico


--------------------------------------------------------------------------------
/src/app/globals.css:
--------------------------------------------------------------------------------
 1 | @tailwind base;
 2 | @tailwind components;
 3 | @tailwind utilities;
 4 |  
 5 | @layer base {
 6 |   :root {
 7 |     --background: 0 0% 100%;
 8 |     --foreground: 222.2 84% 4.9%;
 9 | 
10 |     --card: 0 0% 100%;
11 |     --card-foreground: 222.2 84% 4.9%;
12 |  
13 |     --popover: 0 0% 100%;
14 |     --popover-foreground: 222.2 84% 4.9%;
15 |  
16 |     --primary: 222.2 47.4% 11.2%;
17 |     --primary-foreground: 210 40% 98%;
18 |  
19 |     --secondary: 210 40% 96.1%;
20 |     --secondary-foreground: 222.2 47.4% 11.2%;
21 |  
22 |     --muted: 210 40% 96.1%;
23 |     --muted-foreground: 215.4 16.3% 46.9%;
24 |  
25 |     --accent: 210 40% 96.1%;
26 |     --accent-foreground: 222.2 47.4% 11.2%;
27 |  
28 |     --destructive: 0 84.2% 60.2%;
29 |     --destructive-foreground: 210 40% 98%;
30 | 
31 |     --border: 214.3 31.8% 91.4%;
32 |     --input: 214.3 31.8% 91.4%;
33 |     --ring: 222.2 84% 4.9%;
34 |  
35 |     --radius: 0.5rem;
36 |   }
37 |  
38 |   .dark {
39 |     --background: 222.2 84% 4.9%;
40 |     --foreground: 210 40% 98%;
41 |  
42 |     --card: 222.2 84% 4.9%;
43 |     --card-foreground: 210 40% 98%;
44 |  
45 |     --popover: 222.2 84% 4.9%;
46 |     --popover-foreground: 210 40% 98%;
47 |  
48 |     --primary: 210 40% 98%;
49 |     --primary-foreground: 222.2 47.4% 11.2%;
50 |  
51 |     --secondary: 217.2 32.6% 17.5%;
52 |     --secondary-foreground: 210 40% 98%;
53 |  
54 |     --muted: 217.2 32.6% 17.5%;
55 |     --muted-foreground: 215 20.2% 65.1%;
56 |  
57 |     --accent: 217.2 32.6% 17.5%;
58 |     --accent-foreground: 210 40% 98%;
59 |  
60 |     --destructive: 0 62.8% 30.6%;
61 |     --destructive-foreground: 210 40% 98%;
62 |  
63 |     --border: 217.2 32.6% 17.5%;
64 |     --input: 217.2 32.6% 17.5%;
65 |     --ring: hsl(212.7,26.8%,83.9);
66 |   }
67 | }
68 |  
69 | @layer base {
70 |   * {
71 |     @apply border-border;
72 |   }
73 |   body {
74 |     @apply bg-background text-foreground;
75 |   }
76 | }


--------------------------------------------------------------------------------
/src/app/layout.tsx:
--------------------------------------------------------------------------------
 1 | import { Sidebar } from "@/components/Sidebar";
 2 | import ClientToast from "@/components/client/ClientToast";
 3 | import { ThemeProvider } from "@/components/theme-provider";
 4 | import { ModeToggle } from "@/components/theme-toggle";
 5 | import type { Metadata } from "next";
 6 | import { Inter } from "next/font/google";
 7 | import "./globals.css";
 8 | import { AuthAlert } from "@/components/client/AuthAlert";
 9 | 
10 | const inter = Inter({ subsets: ["latin"] });
11 | 
12 | export const metadata: Metadata = {
13 | 	title: "Create Next App",
14 | 	description: "Generated by create next app",
15 | };
16 | 
17 | export default function RootLayout({
18 | 	children,
19 | }: {
20 | 	children: React.ReactNode;
21 | }) {
22 | 	return (
23 | 		<html lang="en">
24 | 			<body className={inter.className}>
25 | 				<ThemeProvider
26 | 					attribute="class"
27 | 					defaultTheme="system"
28 | 					enableSystem
29 | 				>
30 | 					<div className="h-screen">
31 | 						<div className="grid grid-cols-4 h-full">
32 | 							<Sidebar />
33 | 							<div
34 | 								className="col-span-3 border-x-[1px] 
35 | 								border-neutral-200 
36 |               dark:border-neutral-800 lg:col-span-2"
37 | 							>
38 | 								{children}
39 | 							</div>
40 | 						</div>
41 | 					</div>
42 | 					<ClientToast />
43 | 					<ModeToggle />
44 | 				</ThemeProvider>
45 | 			</body>
46 | 		</html>
47 | 	);
48 | }
49 | 


--------------------------------------------------------------------------------
/src/app/page.tsx:
--------------------------------------------------------------------------------
 1 | import { AddThreadForm } from "@/components/client/AddThreadForm";
 2 | import { AuthAlert } from "@/components/client/AuthAlert";
 3 | import { Thread, User } from "@/db/schema";
 4 | import { getAuthSession } from "@/lib/auth";
 5 | import { getFeedAction } from "./_actions/thread";
 6 | import { ThreadList } from "@/components/client/ThreadList";
 7 | export default async function Home() {
 8 | 	const session = await getAuthSession();
 9 | 	const thread_data = await getFeedAction();
10 | 	return (
11 | 		<main className="flex min-h-screen flex-col items-center justify-start">
12 | 			{/* <pre>{JSON.stringify(session, null, 2)}</pre> */}
13 | 			<AddThreadForm session={session}></AddThreadForm>
14 | 			<AuthAlert session={session}></AuthAlert>
15 | 			<ThreadList thread_data={thread_data}></ThreadList>
16 | 		</main>
17 | 	);
18 | }
19 | 


--------------------------------------------------------------------------------
/src/components/Sidebar.tsx:
--------------------------------------------------------------------------------
 1 | import { getAuthSession } from "@/lib/auth";
 2 | import SignIn from "./client/SignIn";
 3 | import { SignOut } from "./client/SignOut";
 4 | 
 5 | export const Sidebar = async () => {
 6 | 	const session = await getAuthSession();
 7 | 	return (
 8 | 		<div className="flex flex-col">
 9 | 			<div className="p-4 w-full justify-center">
10 | 				{!session ? (
11 | 					<SignIn className="" />
12 | 				) : (
13 | 					<SignOut className="w-1/2" />
14 | 				)}
15 | 			</div>
16 | 		</div>
17 | 	);
18 | };
19 | 


--------------------------------------------------------------------------------
/src/components/client/AddThreadForm.tsx:
--------------------------------------------------------------------------------
  1 | "use client";
  2 | import { addThreadsSchema } from "@/validations/thread";
  3 | import React, { useState } from "react";
  4 | import { useFieldArray, useForm } from "react-hook-form";
  5 | import { z } from "zod";
  6 | import { zodResolver } from "@hookform/resolvers/zod";
  7 | import {
  8 | 	Form,
  9 | 	FormControl,
 10 | 	FormField,
 11 | 	FormItem,
 12 | 	FormMessage,
 13 | } from "../ui/form";
 14 | import { Button } from "../ui/button";
 15 | import { motion } from "framer-motion";
 16 | import { v4 as uuidv4 } from "uuid";
 17 | import { Session } from "next-auth";
 18 | import Image from "next/image";
 19 | import { TextArea } from "./TextArea";
 20 | import { X } from "lucide-react";
 21 | import { catchError } from "@/lib/utils";
 22 | import { addThreadsAction } from "@/app/_actions/thread";
 23 | import { toast } from "sonner";
 24 | export const AddThreadForm = ({
 25 | 	session,
 26 | }: {
 27 | 	session: Session | undefined | null;
 28 | }) => {
 29 | 	async function onSubmit(data: z.infer<typeof addThreadsSchema>) {
 30 | 		try {
 31 | 			await addThreadsAction(data);
 32 | 			toast.success("Thread added successfully");
 33 | 			form.reset();
 34 | 		} catch (error) {
 35 | 			catchError(error);
 36 | 		}
 37 | 	}
 38 | 	const [dialogueId, _] = useState(uuidv4());
 39 | 	const form = useForm<z.infer<typeof addThreadsSchema>>({
 40 | 		resolver: zodResolver(addThreadsSchema),
 41 | 		defaultValues: {
 42 | 			threads: [{ text: "", dialogueId: dialogueId }],
 43 | 		},
 44 | 	});
 45 | 	const { fields, append, remove } = useFieldArray({
 46 | 		name: "threads",
 47 | 		control: form.control,
 48 | 	});
 49 | 	return (
 50 | 		<Form {...form}>
 51 | 			<form
 52 | 				onSubmit={form.handleSubmit(onSubmit)}
 53 | 				className="mt-6 w-full"
 54 | 			>
 55 | 				{/* {JSON.stringify(form.watch(), null, 2)} */}
 56 | 				<div className="flex flex-col">
 57 | 					{fields.map((field, index) => {
 58 | 						return (
 59 | 							<motion.div
 60 | 								initial={{ opacity: 0, y: 100 }}
 61 | 								animate={{
 62 | 									opacity: 1,
 63 | 									y: 0,
 64 | 									transition: {
 65 | 										ease: "easeInOut",
 66 | 										duration: 0.1,
 67 | 									},
 68 | 								}}
 69 | 								exit={{ opacity: 0 }}
 70 | 								layout
 71 | 								key={field.id}
 72 | 								className="relative"
 73 | 							>
 74 | 								<div className="h-20 w-[2px] absolute left-8 top-6 -z-10 bg-gray-700/40"></div>
 75 | 								<FormField
 76 | 									control={form.control}
 77 | 									name={`threads.${index}.text`}
 78 | 									render={({ field }) => (
 79 | 										<FormItem className="relative">
 80 | 											<div className="flex gap-4">
 81 | 												<div className="w-10 h-10 mx-4">
 82 | 													<Image
 83 | 														className="rounded-full"
 84 | 														width={50}
 85 | 														height={50}
 86 | 														alt="profile_pic"
 87 | 														src={
 88 | 															session?.user
 89 | 																.image ??
 90 | 															"https://icon-library.com/images/default-user-icon/default-user-icon-8.jpg"
 91 | 														}
 92 | 													/>
 93 | 												</div>
 94 | 												<div className="flex flex-col w-full">
 95 | 													<div>
 96 | 														@
 97 | 														{session?.user.username}
 98 | 													</div>
 99 | 													<FormControl className="w-full">
100 | 														<TextArea
101 | 															placeholder="Add thread"
102 | 															name={field.name}
103 | 															onBlur={
104 | 																field.onBlur
105 | 															}
106 | 															onChange={
107 | 																field.onChange
108 | 															}
109 | 															value={field.value}
110 | 															className="text-area-thread placeholder:text-red-400 w-full"
111 | 														/>
112 | 													</FormControl>
113 | 												</div>
114 | 												{index > 0 && (
115 | 													<button
116 | 														onClick={() =>
117 | 															remove(index)
118 | 														}
119 | 														type={"button"}
120 | 														className="mr-4 absolute right-0"
121 | 													>
122 | 														<X className="text-gray-600"></X>
123 | 													</button>
124 | 												)}
125 | 											</div>
126 | 											<FormMessage className="m-4" />
127 | 										</FormItem>
128 | 									)}
129 | 								/>
130 | 							</motion.div>
131 | 						);
132 | 					})}
133 | 				</div>
134 | 				<Button type={"submit"}>Submit</Button>
135 | 			</form>
136 | 			<Button
137 | 				onClick={() => {
138 | 					append({ text: "", dialogueId });
139 | 				}}
140 | 			>
141 | 				Add Thread
142 | 			</Button>
143 | 		</Form>
144 | 	);
145 | };
146 | 


--------------------------------------------------------------------------------
/src/components/client/AuthAlert.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | 
 3 | import React from "react";
 4 | import {
 5 | 	Dialog,
 6 | 	DialogClose,
 7 | 	DialogContent,
 8 | 	DialogDescription,
 9 | 	DialogHeader,
10 | 	DialogTitle,
11 | } from "@/components/ui/dialog";
12 | import { Button } from "../ui/button";
13 | import { useLogInDialog } from "@/store/useLoginDialogStore";
14 | import { Session } from "next-auth";
15 | import SignIn from "./SignIn";
16 | export const AuthAlert = ({ session }: { session: Session | null }) => {
17 | 	const { open, setOpen } = useLogInDialog((state) => ({
18 | 		open: state.open,
19 | 		setOpen: state.setOpen,
20 | 	}));
21 | 	React.useEffect(() => {
22 | 		if (!session) {
23 | 			setOpen(true);
24 | 		}
25 | 	}, []);
26 | 	return (
27 | 		<Dialog open={open} onOpenChange={setOpen}>
28 | 			<DialogContent>
29 | 				<DialogHeader>
30 | 					<DialogTitle>Please log in with Google</DialogTitle>
31 | 					<DialogDescription>
32 | 						This action cannot be undone. This will permanently
33 | 						delete your account and remove your data from our
34 | 						servers.
35 | 					</DialogDescription>
36 | 				</DialogHeader>
37 | 				<div className="flex justify-start w-full gap-4 mt-4">
38 | 					<SignIn />
39 | 					<DialogClose>
40 | 						<Button variant={"outline"}>I dont wanna</Button>
41 | 					</DialogClose>
42 | 				</div>
43 | 			</DialogContent>
44 | 			{/* <Toaster /> */}
45 | 		</Dialog>
46 | 	);
47 | };
48 | 


--------------------------------------------------------------------------------
/src/components/client/ClientToast.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | 
 3 | import React from "react";
 4 | import { Toaster } from "sonner";
 5 | 
 6 | const ClientToast = () => {
 7 | 	return <Toaster />;
 8 | };
 9 | 
10 | export default ClientToast;
11 | 


--------------------------------------------------------------------------------
/src/components/client/RepliesComponent.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | import React from "react";
 3 | 
 4 | import Image from "next/image";
 5 | import Link from "next/link";
 6 | import { Card } from "../ui/card";
 7 | import { Button } from "../ui/button";
 8 | import { User } from "@/db/schema";
 9 | import { useForm } from "react-hook-form";
10 | import { z } from "zod";
11 | import { zodResolver } from "@hookform/resolvers/zod";
12 | import { catchError } from "@/lib/utils";
13 | import { Trash } from "lucide-react";
14 | import { deleteThreadAction } from "@/app/_actions/thread";
15 | // import { createReplyAction } from "@/app/_actions/thread";
16 | const RepliesComponent = ({
17 | 	text,
18 | 	image,
19 | 	username,
20 | 	id,
21 | 	index,
22 | 	length,
23 | }: {
24 | 	text: string;
25 | 	image: string;
26 | 	id: string;
27 | 	username: string;
28 | 	length: number;
29 | 	index: number;
30 | }) => {
31 | 	return (
32 | 		<Card className="border-none py-2 px-4 flex gap-4 hover:bg-slate-50 hover:dark:bg-slate-900 rounded-none transition-colors duration-100">
33 | 			<Link href={`/dialogue/${id}`} className="relative">
34 | 				<div className="z-50">
35 | 					<Image
36 | 						className="rounded-full w-8 h-8 "
37 | 						width={50}
38 | 						height={50}
39 | 						alt="profile_pic"
40 | 						src={
41 | 							image ??
42 | 							"https://icon-library.com/images/default-user-icon/default-user-icon-8.jpg"
43 | 						}
44 | 					/>
45 | 					{!(index === 0) ? (
46 | 						<div className="-z-10 absolute top-0 left-8 w-[2px] h-1/2 bg-gray-200 dark:bg-gray-700"></div>
47 | 					) : null}
48 | 					{index !== length - 1 ? (
49 | 						<div className="-z-10 absolute bottom-0 left-8 w-[2px] h-1/2 bg-gray-200 dark:bg-gray-700"></div>
50 | 					) : null}
51 | 				</div>
52 | 				<div className="flex flex-col gap-2">
53 | 					<div className="flex gap-4 items-center font-semibold text-sm">
54 | 						@{username}
55 | 					</div>
56 | 					<div className="flex flex-col">{text}</div>
57 | 				</div>
58 | 			</Link>
59 | 			<Button
60 | 				onClick={async () => {
61 | 					try {
62 | 						await deleteThreadAction(id);
63 | 					} catch (error) {
64 | 						catchError(error);
65 | 					}
66 | 				}}
67 | 				className="absolute right-4"
68 | 				variant={"ghost"}
69 | 			>
70 | 				<Trash></Trash>
71 | 			</Button>
72 | 		</Card>
73 | 	);
74 | };
75 | 
76 | export { RepliesComponent };
77 | 


--------------------------------------------------------------------------------
/src/components/client/SignIn.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | 
 3 | import { catchError, cn } from "@/lib/utils";
 4 | import { signIn } from "next-auth/react";
 5 | import * as React from "react";
 6 | import { FC } from "react";
 7 | import { Button } from "../ui/button";
 8 | import { toast } from "sonner";
 9 | import { FcGoogle } from "react-icons/fc";
10 | 
11 | interface SignInWithGoogleProps extends React.HTMLAttributes<HTMLDivElement> {}
12 | 
13 | const SignIn: FC<SignInWithGoogleProps> = ({ className, ...props }) => {
14 | 	const [isLoading, setIsLoading] = React.useState<boolean>(false);
15 | 
16 | 	const loginWithGoogle = async () => {
17 | 		setIsLoading(true);
18 | 
19 | 		try {
20 | 			await signIn("google");
21 | 		} catch (error) {
22 | 			catchError(error);
23 | 		} finally {
24 | 			setIsLoading(false);
25 | 		}
26 | 	};
27 | 
28 | 	return (
29 | 		<div className={cn("flex justify-center", className)} {...props}>
30 | 			<Button
31 | 				type="button"
32 | 				className="flex gap-2"
33 | 				onClick={loginWithGoogle}
34 | 				disabled={isLoading}
35 | 			>
36 | 				<FcGoogle className="text-lg" />
37 | 				<p className="md:block hidden">Google</p>
38 | 			</Button>
39 | 		</div>
40 | 	);
41 | };
42 | 
43 | export default SignIn;
44 | 


--------------------------------------------------------------------------------
/src/components/client/SignOut.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | 
 3 | import { signOut } from "next-auth/react";
 4 | import { Button } from "../ui/button";
 5 | import { catchError } from "@/lib/utils";
 6 | import { twMerge } from "tailwind-merge";
 7 | 
 8 | export const SignOut = ({className}:{
 9 |   className?: string
10 | }) => {
11 | 	return (
12 | 		<Button
13 |     className={twMerge("flex gap-2", className)}
14 | 			onClick={() => {
15 | 				try {
16 | 					signOut();
17 | 				} catch (err) {
18 | 					catchError(err);
19 | 				}
20 | 			}}
21 | 		>
22 | 			<h1>Sign Out</h1>
23 | 		</Button>
24 | 	);
25 | };
26 | 


--------------------------------------------------------------------------------
/src/components/client/TextArea.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | import TextareaAutosize from "react-textarea-autosize";
 3 | import React from "react";
 4 | import { twMerge } from "tailwind-merge";
 5 | 
 6 | export interface TextareaProps
 7 | 	extends React.TextareaHTMLAttributes<HTMLTextAreaElement> {}
 8 | 
 9 | const TextArea = React.forwardRef<HTMLTextAreaElement, TextareaProps>(
10 | 	({ name, onBlur, onChange, value, className }, ref) => {
11 | 		return (
12 | 			<TextareaAutosize
13 | 				onBlur={onBlur}
14 | 				onChange={onChange}
15 | 				value={value}
16 | 				name={name}
17 | 				ref={ref}
18 | 				className={twMerge(
19 | 					"bg-transparent w-full h-24 p-4 text-lg outline-0",
20 | 					className
21 | 				)}
22 | 			/>
23 | 		);
24 | 	}
25 | );
26 | TextArea.displayName = "TextArea";
27 | 
28 | export {TextArea}


--------------------------------------------------------------------------------
/src/components/client/ThreadList.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | 
 3 | import { motion, AnimatePresence } from "framer-motion";
 4 | import Link from "next/link";
 5 | import { Card, CardHeader } from "@/components/ui/card";
 6 | import { Button } from "@/components/ui/button";
 7 | import { Trash } from "lucide-react";
 8 | import { Thread, User } from "@/db/schema";
 9 | import { deleteThreadAction } from "@/app/_actions/thread";
10 | 
11 | export const ThreadList = ({
12 | 	thread_data,
13 | }: {
14 | 	thread_data: (Thread & { user: Pick<User, "username" | "image" | "id"> })[];
15 | }) => {
16 | 	return (
17 | 		<div className="flex flex-col w-full">
18 | 			<AnimatePresence>
19 | 				{thread_data.map((thread) => (
20 | 					<motion.div
21 | 						key={thread.id}
22 | 						initial={{ opacity: 0 }}
23 | 						animate={{ opacity: 1 }}
24 | 						exit={{ opacity: 1 }}
25 | 						layout
26 | 					>
27 | 						<Card className="rounded-none flex justify-between relative">
28 | 							<Link href={`/dialogue/${thread.id}`}>
29 | 								<CardHeader>
30 | 									<div className="text-lg">
31 | 										{thread.user.username?.toLowerCase()}
32 | 									</div>
33 | 									<p className="text-lg">{thread.text}</p>
34 | 								</CardHeader>
35 | 							</Link>
36 | 							<div className="h-full flex items-center absolute top-0 bottom-0 right-0">
37 | 								<Button
38 | 									onClick={() => {
39 | 										deleteThreadAction(thread.id);
40 | 									}}
41 | 									variant={"ghost"}
42 | 									className="mr-4"
43 | 								>
44 | 									<Trash></Trash>
45 | 								</Button>
46 | 							</div>
47 | 						</Card>
48 | 					</motion.div>
49 | 				))}
50 | 			</AnimatePresence>
51 | 		</div>
52 | 	);
53 | };
54 | 


--------------------------------------------------------------------------------
/src/components/theme-provider.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | 
 3 | import * as React from "react";
 4 | import { ThemeProvider as NextThemesProvider } from "next-themes";
 5 | import { type ThemeProviderProps } from "next-themes/dist/types";
 6 | 
 7 | export function ThemeProvider({ children, ...props }: ThemeProviderProps) {
 8 | 	return <NextThemesProvider {...props}>{children}</NextThemesProvider>;
 9 | }
10 | 


--------------------------------------------------------------------------------
/src/components/theme-toggle.tsx:
--------------------------------------------------------------------------------
 1 | "use client";
 2 | 
 3 | import * as React from "react";
 4 | import { MoonIcon, SunIcon } from "@radix-ui/react-icons";
 5 | import { useTheme } from "next-themes";
 6 | 
 7 | import { Button } from "@/components/ui/button";
 8 | import {
 9 | 	DropdownMenu,
10 | 	DropdownMenuContent,
11 | 	DropdownMenuItem,
12 | 	DropdownMenuTrigger,
13 | } from "@/components/ui/dropdown-menu";
14 | 
15 | export function ModeToggle() {
16 | 	const { setTheme } = useTheme();
17 | 
18 | 	return (
19 | 		<DropdownMenu>
20 | 			<DropdownMenuTrigger asChild>
21 | 				<Button variant="outline" size="icon">
22 | 					<SunIcon className="h-[1.2rem] w-[1.2rem] rotate-0 scale-100 transition-all dark:-rotate-90 dark:scale-0" />
23 | 					<MoonIcon className="absolute h-[1.2rem] w-[1.2rem] rotate-90 scale-0 transition-all dark:rotate-0 dark:scale-100" />
24 | 					<span className="sr-only">Toggle theme</span>
25 | 				</Button>
26 | 			</DropdownMenuTrigger>
27 | 			<DropdownMenuContent align="end">
28 | 				<DropdownMenuItem onClick={() => setTheme("light")}>
29 | 					Light
30 | 				</DropdownMenuItem>
31 | 				<DropdownMenuItem onClick={() => setTheme("dark")}>
32 | 					Dark
33 | 				</DropdownMenuItem>
34 | 				<DropdownMenuItem onClick={() => setTheme("system")}>
35 | 					System
36 | 				</DropdownMenuItem>
37 | 			</DropdownMenuContent>
38 | 		</DropdownMenu>
39 | 	);
40 | }
41 | 


--------------------------------------------------------------------------------
/src/components/ui/button.tsx:
--------------------------------------------------------------------------------
 1 | import * as React from "react"
 2 | import { Slot } from "@radix-ui/react-slot"
 3 | import { cva, type VariantProps } from "class-variance-authority"
 4 | 
 5 | import { cn } from "@/lib/utils"
 6 | 
 7 | const buttonVariants = cva(
 8 |   "inline-flex items-center justify-center rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
 9 |   {
10 |     variants: {
11 |       variant: {
12 |         default: "bg-primary text-primary-foreground hover:bg-primary/90",
13 |         destructive:
14 |           "bg-destructive text-destructive-foreground hover:bg-destructive/90",
15 |         outline:
16 |           "border border-input bg-background hover:bg-accent hover:text-accent-foreground",
17 |         secondary:
18 |           "bg-secondary text-secondary-foreground hover:bg-secondary/80",
19 |         ghost: "hover:bg-accent hover:text-accent-foreground",
20 |         link: "text-primary underline-offset-4 hover:underline",
21 |       },
22 |       size: {
23 |         default: "h-10 px-4 py-2",
24 |         sm: "h-9 rounded-md px-3",
25 |         lg: "h-11 rounded-md px-8",
26 |         icon: "h-10 w-10",
27 |       },
28 |     },
29 |     defaultVariants: {
30 |       variant: "default",
31 |       size: "default",
32 |     },
33 |   }
34 | )
35 | 
36 | export interface ButtonProps
37 |   extends React.ButtonHTMLAttributes<HTMLButtonElement>,
38 |     VariantProps<typeof buttonVariants> {
39 |   asChild?: boolean
40 | }
41 | 
42 | const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
43 |   ({ className, variant, size, asChild = false, ...props }, ref) => {
44 |     const Comp = asChild ? Slot : "button"
45 |     return (
46 |       <Comp
47 |         className={cn(buttonVariants({ variant, size, className }))}
48 |         ref={ref}
49 |         {...props}
50 |       />
51 |     )
52 |   }
53 | )
54 | Button.displayName = "Button"
55 | 
56 | export { Button, buttonVariants }
57 | 


--------------------------------------------------------------------------------
/src/components/ui/card.tsx:
--------------------------------------------------------------------------------
 1 | import * as React from "react"
 2 | 
 3 | import { cn } from "@/lib/utils"
 4 | 
 5 | const Card = React.forwardRef<
 6 |   HTMLDivElement,
 7 |   React.HTMLAttributes<HTMLDivElement>
 8 | >(({ className, ...props }, ref) => (
 9 |   <div
10 |     ref={ref}
11 |     className={cn(
12 |       "rounded-lg border bg-card text-card-foreground shadow-sm",
13 |       className
14 |     )}
15 |     {...props}
16 |   />
17 | ))
18 | Card.displayName = "Card"
19 | 
20 | const CardHeader = React.forwardRef<
21 |   HTMLDivElement,
22 |   React.HTMLAttributes<HTMLDivElement>
23 | >(({ className, ...props }, ref) => (
24 |   <div
25 |     ref={ref}
26 |     className={cn("flex flex-col space-y-1.5 p-6", className)}
27 |     {...props}
28 |   />
29 | ))
30 | CardHeader.displayName = "CardHeader"
31 | 
32 | const CardTitle = React.forwardRef<
33 |   HTMLParagraphElement,
34 |   React.HTMLAttributes<HTMLHeadingElement>
35 | >(({ className, ...props }, ref) => (
36 |   <h3
37 |     ref={ref}
38 |     className={cn(
39 |       "text-2xl font-semibold leading-none tracking-tight",
40 |       className
41 |     )}
42 |     {...props}
43 |   />
44 | ))
45 | CardTitle.displayName = "CardTitle"
46 | 
47 | const CardDescription = React.forwardRef<
48 |   HTMLParagraphElement,
49 |   React.HTMLAttributes<HTMLParagraphElement>
50 | >(({ className, ...props }, ref) => (
51 |   <p
52 |     ref={ref}
53 |     className={cn("text-sm text-muted-foreground", className)}
54 |     {...props}
55 |   />
56 | ))
57 | CardDescription.displayName = "CardDescription"
58 | 
59 | const CardContent = React.forwardRef<
60 |   HTMLDivElement,
61 |   React.HTMLAttributes<HTMLDivElement>
62 | >(({ className, ...props }, ref) => (
63 |   <div ref={ref} className={cn("p-6 pt-0", className)} {...props} />
64 | ))
65 | CardContent.displayName = "CardContent"
66 | 
67 | const CardFooter = React.forwardRef<
68 |   HTMLDivElement,
69 |   React.HTMLAttributes<HTMLDivElement>
70 | >(({ className, ...props }, ref) => (
71 |   <div
72 |     ref={ref}
73 |     className={cn("flex items-center p-6 pt-0", className)}
74 |     {...props}
75 |   />
76 | ))
77 | CardFooter.displayName = "CardFooter"
78 | 
79 | export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent }
80 | 


--------------------------------------------------------------------------------
/src/components/ui/dialog.tsx:
--------------------------------------------------------------------------------
  1 | "use client";
  2 | 
  3 | import * as React from "react";
  4 | import * as DialogPrimitive from "@radix-ui/react-dialog";
  5 | import { X } from "lucide-react";
  6 | 
  7 | import { cn } from "@/lib/utils";
  8 | 
  9 | const Dialog = DialogPrimitive.Root;
 10 | 
 11 | const DialogTrigger = DialogPrimitive.Trigger;
 12 | const DialogClose = DialogPrimitive.Close;
 13 | const DialogPortal = ({
 14 | 	className,
 15 | 	...props
 16 | }: DialogPrimitive.DialogPortalProps) => (
 17 | 	<DialogPrimitive.Portal className={cn(className)} {...props} />
 18 | );
 19 | DialogPortal.displayName = DialogPrimitive.Portal.displayName;
 20 | 
 21 | const DialogOverlay = React.forwardRef<
 22 | 	React.ElementRef<typeof DialogPrimitive.Overlay>,
 23 | 	React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>
 24 | >(({ className, ...props }, ref) => (
 25 | 	<DialogPrimitive.Overlay
 26 | 		ref={ref}
 27 | 		className={cn(
 28 | 			"fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
 29 | 			className
 30 | 		)}
 31 | 		{...props}
 32 | 	/>
 33 | ));
 34 | DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 35 | 
 36 | const DialogContent = React.forwardRef<
 37 | 	React.ElementRef<typeof DialogPrimitive.Content>,
 38 | 	React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>
 39 | >(({ className, children, ...props }, ref) => (
 40 | 	<DialogPortal>
 41 | 		<DialogOverlay />
 42 | 		<DialogPrimitive.Content
 43 | 			ref={ref}
 44 | 			className={cn(
 45 | 				"fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",
 46 | 				className
 47 | 			)}
 48 | 			{...props}
 49 | 		>
 50 | 			{children}
 51 | 			<DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground">
 52 | 				<X className="h-4 w-4" />
 53 | 				<span className="sr-only">Close</span>
 54 | 			</DialogPrimitive.Close>
 55 | 		</DialogPrimitive.Content>
 56 | 	</DialogPortal>
 57 | ));
 58 | DialogContent.displayName = DialogPrimitive.Content.displayName;
 59 | 
 60 | const DialogHeader = ({
 61 | 	className,
 62 | 	...props
 63 | }: React.HTMLAttributes<HTMLDivElement>) => (
 64 | 	<div
 65 | 		className={cn(
 66 | 			"flex flex-col space-y-1.5 text-center sm:text-left",
 67 | 			className
 68 | 		)}
 69 | 		{...props}
 70 | 	/>
 71 | );
 72 | DialogHeader.displayName = "DialogHeader";
 73 | 
 74 | const DialogFooter = ({
 75 | 	className,
 76 | 	...props
 77 | }: React.HTMLAttributes<HTMLDivElement>) => (
 78 | 	<div
 79 | 		className={cn(
 80 | 			"flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
 81 | 			className
 82 | 		)}
 83 | 		{...props}
 84 | 	/>
 85 | );
 86 | DialogFooter.displayName = "DialogFooter";
 87 | 
 88 | const DialogTitle = React.forwardRef<
 89 | 	React.ElementRef<typeof DialogPrimitive.Title>,
 90 | 	React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>
 91 | >(({ className, ...props }, ref) => (
 92 | 	<DialogPrimitive.Title
 93 | 		ref={ref}
 94 | 		className={cn(
 95 | 			"text-lg font-semibold leading-none tracking-tight",
 96 | 			className
 97 | 		)}
 98 | 		{...props}
 99 | 	/>
100 | ));
101 | DialogTitle.displayName = DialogPrimitive.Title.displayName;
102 | 
103 | const DialogDescription = React.forwardRef<
104 | 	React.ElementRef<typeof DialogPrimitive.Description>,
105 | 	React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>
106 | >(({ className, ...props }, ref) => (
107 | 	<DialogPrimitive.Description
108 | 		ref={ref}
109 | 		className={cn("text-sm text-muted-foreground", className)}
110 | 		{...props}
111 | 	/>
112 | ));
113 | DialogDescription.displayName = DialogPrimitive.Description.displayName;
114 | 
115 | export {
116 | 	Dialog,
117 | 	DialogTrigger,
118 | 	DialogContent,
119 | 	DialogHeader,
120 | 	DialogFooter,
121 | 	DialogTitle,
122 | 	DialogDescription,
123 | 	DialogClose,
124 | };
125 | 


--------------------------------------------------------------------------------
/src/components/ui/dropdown-menu.tsx:
--------------------------------------------------------------------------------
  1 | "use client"
  2 | 
  3 | import * as React from "react"
  4 | import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu"
  5 | import { Check, ChevronRight, Circle } from "lucide-react"
  6 | 
  7 | import { cn } from "@/lib/utils"
  8 | 
  9 | const DropdownMenu = DropdownMenuPrimitive.Root
 10 | 
 11 | const DropdownMenuTrigger = DropdownMenuPrimitive.Trigger
 12 | 
 13 | const DropdownMenuGroup = DropdownMenuPrimitive.Group
 14 | 
 15 | const DropdownMenuPortal = DropdownMenuPrimitive.Portal
 16 | 
 17 | const DropdownMenuSub = DropdownMenuPrimitive.Sub
 18 | 
 19 | const DropdownMenuRadioGroup = DropdownMenuPrimitive.RadioGroup
 20 | 
 21 | const DropdownMenuSubTrigger = React.forwardRef<
 22 |   React.ElementRef<typeof DropdownMenuPrimitive.SubTrigger>,
 23 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubTrigger> & {
 24 |     inset?: boolean
 25 |   }
 26 | >(({ className, inset, children, ...props }, ref) => (
 27 |   <DropdownMenuPrimitive.SubTrigger
 28 |     ref={ref}
 29 |     className={cn(
 30 |       "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",
 31 |       inset && "pl-8",
 32 |       className
 33 |     )}
 34 |     {...props}
 35 |   >
 36 |     {children}
 37 |     <ChevronRight className="ml-auto h-4 w-4" />
 38 |   </DropdownMenuPrimitive.SubTrigger>
 39 | ))
 40 | DropdownMenuSubTrigger.displayName =
 41 |   DropdownMenuPrimitive.SubTrigger.displayName
 42 | 
 43 | const DropdownMenuSubContent = React.forwardRef<
 44 |   React.ElementRef<typeof DropdownMenuPrimitive.SubContent>,
 45 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.SubContent>
 46 | >(({ className, ...props }, ref) => (
 47 |   <DropdownMenuPrimitive.SubContent
 48 |     ref={ref}
 49 |     className={cn(
 50 |       "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
 51 |       className
 52 |     )}
 53 |     {...props}
 54 |   />
 55 | ))
 56 | DropdownMenuSubContent.displayName =
 57 |   DropdownMenuPrimitive.SubContent.displayName
 58 | 
 59 | const DropdownMenuContent = React.forwardRef<
 60 |   React.ElementRef<typeof DropdownMenuPrimitive.Content>,
 61 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Content>
 62 | >(({ className, sideOffset = 4, ...props }, ref) => (
 63 |   <DropdownMenuPrimitive.Portal>
 64 |     <DropdownMenuPrimitive.Content
 65 |       ref={ref}
 66 |       sideOffset={sideOffset}
 67 |       className={cn(
 68 |         "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
 69 |         className
 70 |       )}
 71 |       {...props}
 72 |     />
 73 |   </DropdownMenuPrimitive.Portal>
 74 | ))
 75 | DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName
 76 | 
 77 | const DropdownMenuItem = React.forwardRef<
 78 |   React.ElementRef<typeof DropdownMenuPrimitive.Item>,
 79 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Item> & {
 80 |     inset?: boolean
 81 |   }
 82 | >(({ className, inset, ...props }, ref) => (
 83 |   <DropdownMenuPrimitive.Item
 84 |     ref={ref}
 85 |     className={cn(
 86 |       "relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
 87 |       inset && "pl-8",
 88 |       className
 89 |     )}
 90 |     {...props}
 91 |   />
 92 | ))
 93 | DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName
 94 | 
 95 | const DropdownMenuCheckboxItem = React.forwardRef<
 96 |   React.ElementRef<typeof DropdownMenuPrimitive.CheckboxItem>,
 97 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.CheckboxItem>
 98 | >(({ className, children, checked, ...props }, ref) => (
 99 |   <DropdownMenuPrimitive.CheckboxItem
100 |     ref={ref}
101 |     className={cn(
102 |       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
103 |       className
104 |     )}
105 |     checked={checked}
106 |     {...props}
107 |   >
108 |     <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
109 |       <DropdownMenuPrimitive.ItemIndicator>
110 |         <Check className="h-4 w-4" />
111 |       </DropdownMenuPrimitive.ItemIndicator>
112 |     </span>
113 |     {children}
114 |   </DropdownMenuPrimitive.CheckboxItem>
115 | ))
116 | DropdownMenuCheckboxItem.displayName =
117 |   DropdownMenuPrimitive.CheckboxItem.displayName
118 | 
119 | const DropdownMenuRadioItem = React.forwardRef<
120 |   React.ElementRef<typeof DropdownMenuPrimitive.RadioItem>,
121 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.RadioItem>
122 | >(({ className, children, ...props }, ref) => (
123 |   <DropdownMenuPrimitive.RadioItem
124 |     ref={ref}
125 |     className={cn(
126 |       "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
127 |       className
128 |     )}
129 |     {...props}
130 |   >
131 |     <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
132 |       <DropdownMenuPrimitive.ItemIndicator>
133 |         <Circle className="h-2 w-2 fill-current" />
134 |       </DropdownMenuPrimitive.ItemIndicator>
135 |     </span>
136 |     {children}
137 |   </DropdownMenuPrimitive.RadioItem>
138 | ))
139 | DropdownMenuRadioItem.displayName = DropdownMenuPrimitive.RadioItem.displayName
140 | 
141 | const DropdownMenuLabel = React.forwardRef<
142 |   React.ElementRef<typeof DropdownMenuPrimitive.Label>,
143 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Label> & {
144 |     inset?: boolean
145 |   }
146 | >(({ className, inset, ...props }, ref) => (
147 |   <DropdownMenuPrimitive.Label
148 |     ref={ref}
149 |     className={cn(
150 |       "px-2 py-1.5 text-sm font-semibold",
151 |       inset && "pl-8",
152 |       className
153 |     )}
154 |     {...props}
155 |   />
156 | ))
157 | DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName
158 | 
159 | const DropdownMenuSeparator = React.forwardRef<
160 |   React.ElementRef<typeof DropdownMenuPrimitive.Separator>,
161 |   React.ComponentPropsWithoutRef<typeof DropdownMenuPrimitive.Separator>
162 | >(({ className, ...props }, ref) => (
163 |   <DropdownMenuPrimitive.Separator
164 |     ref={ref}
165 |     className={cn("-mx-1 my-1 h-px bg-muted", className)}
166 |     {...props}
167 |   />
168 | ))
169 | DropdownMenuSeparator.displayName = DropdownMenuPrimitive.Separator.displayName
170 | 
171 | const DropdownMenuShortcut = ({
172 |   className,
173 |   ...props
174 | }: React.HTMLAttributes<HTMLSpanElement>) => {
175 |   return (
176 |     <span
177 |       className={cn("ml-auto text-xs tracking-widest opacity-60", className)}
178 |       {...props}
179 |     />
180 |   )
181 | }
182 | DropdownMenuShortcut.displayName = "DropdownMenuShortcut"
183 | 
184 | export {
185 |   DropdownMenu,
186 |   DropdownMenuTrigger,
187 |   DropdownMenuContent,
188 |   DropdownMenuItem,
189 |   DropdownMenuCheckboxItem,
190 |   DropdownMenuRadioItem,
191 |   DropdownMenuLabel,
192 |   DropdownMenuSeparator,
193 |   DropdownMenuShortcut,
194 |   DropdownMenuGroup,
195 |   DropdownMenuPortal,
196 |   DropdownMenuSub,
197 |   DropdownMenuSubContent,
198 |   DropdownMenuSubTrigger,
199 |   DropdownMenuRadioGroup,
200 | }
201 | 


--------------------------------------------------------------------------------
/src/components/ui/form.tsx:
--------------------------------------------------------------------------------
  1 | import * as React from "react"
  2 | import * as LabelPrimitive from "@radix-ui/react-label"
  3 | import { Slot } from "@radix-ui/react-slot"
  4 | import {
  5 |   Controller,
  6 |   ControllerProps,
  7 |   FieldPath,
  8 |   FieldValues,
  9 |   FormProvider,
 10 |   useFormContext,
 11 | } from "react-hook-form"
 12 | 
 13 | import { cn } from "@/lib/utils"
 14 | import { Label } from "@/components/ui/label"
 15 | 
 16 | const Form = FormProvider
 17 | 
 18 | type FormFieldContextValue<
 19 |   TFieldValues extends FieldValues = FieldValues,
 20 |   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
 21 | > = {
 22 |   name: TName
 23 | }
 24 | 
 25 | const FormFieldContext = React.createContext<FormFieldContextValue>(
 26 |   {} as FormFieldContextValue
 27 | )
 28 | 
 29 | const FormField = <
 30 |   TFieldValues extends FieldValues = FieldValues,
 31 |   TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>
 32 | >({
 33 |   ...props
 34 | }: ControllerProps<TFieldValues, TName>) => {
 35 |   return (
 36 |     <FormFieldContext.Provider value={{ name: props.name }}>
 37 |       <Controller {...props} />
 38 |     </FormFieldContext.Provider>
 39 |   )
 40 | }
 41 | 
 42 | const useFormField = () => {
 43 |   const fieldContext = React.useContext(FormFieldContext)
 44 |   const itemContext = React.useContext(FormItemContext)
 45 |   const { getFieldState, formState } = useFormContext()
 46 | 
 47 |   const fieldState = getFieldState(fieldContext.name, formState)
 48 | 
 49 |   if (!fieldContext) {
 50 |     throw new Error("useFormField should be used within <FormField>")
 51 |   }
 52 | 
 53 |   const { id } = itemContext
 54 | 
 55 |   return {
 56 |     id,
 57 |     name: fieldContext.name,
 58 |     formItemId: `${id}-form-item`,
 59 |     formDescriptionId: `${id}-form-item-description`,
 60 |     formMessageId: `${id}-form-item-message`,
 61 |     ...fieldState,
 62 |   }
 63 | }
 64 | 
 65 | type FormItemContextValue = {
 66 |   id: string
 67 | }
 68 | 
 69 | const FormItemContext = React.createContext<FormItemContextValue>(
 70 |   {} as FormItemContextValue
 71 | )
 72 | 
 73 | const FormItem = React.forwardRef<
 74 |   HTMLDivElement,
 75 |   React.HTMLAttributes<HTMLDivElement>
 76 | >(({ className, ...props }, ref) => {
 77 |   const id = React.useId()
 78 | 
 79 |   return (
 80 |     <FormItemContext.Provider value={{ id }}>
 81 |       <div ref={ref} className={cn("space-y-2", className)} {...props} />
 82 |     </FormItemContext.Provider>
 83 |   )
 84 | })
 85 | FormItem.displayName = "FormItem"
 86 | 
 87 | const FormLabel = React.forwardRef<
 88 |   React.ElementRef<typeof LabelPrimitive.Root>,
 89 |   React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>
 90 | >(({ className, ...props }, ref) => {
 91 |   const { error, formItemId } = useFormField()
 92 | 
 93 |   return (
 94 |     <Label
 95 |       ref={ref}
 96 |       className={cn(error && "text-destructive", className)}
 97 |       htmlFor={formItemId}
 98 |       {...props}
 99 |     />
100 |   )
101 | })
102 | FormLabel.displayName = "FormLabel"
103 | 
104 | const FormControl = React.forwardRef<
105 |   React.ElementRef<typeof Slot>,
106 |   React.ComponentPropsWithoutRef<typeof Slot>
107 | >(({ ...props }, ref) => {
108 |   const { error, formItemId, formDescriptionId, formMessageId } = useFormField()
109 | 
110 |   return (
111 |     <Slot
112 |       ref={ref}
113 |       id={formItemId}
114 |       aria-describedby={
115 |         !error
116 |           ? `${formDescriptionId}`
117 |           : `${formDescriptionId} ${formMessageId}`
118 |       }
119 |       aria-invalid={!!error}
120 |       {...props}
121 |     />
122 |   )
123 | })
124 | FormControl.displayName = "FormControl"
125 | 
126 | const FormDescription = React.forwardRef<
127 |   HTMLParagraphElement,
128 |   React.HTMLAttributes<HTMLParagraphElement>
129 | >(({ className, ...props }, ref) => {
130 |   const { formDescriptionId } = useFormField()
131 | 
132 |   return (
133 |     <p
134 |       ref={ref}
135 |       id={formDescriptionId}
136 |       className={cn("text-sm text-muted-foreground", className)}
137 |       {...props}
138 |     />
139 |   )
140 | })
141 | FormDescription.displayName = "FormDescription"
142 | 
143 | const FormMessage = React.forwardRef<
144 |   HTMLParagraphElement,
145 |   React.HTMLAttributes<HTMLParagraphElement>
146 | >(({ className, children, ...props }, ref) => {
147 |   const { error, formMessageId } = useFormField()
148 |   const body = error ? String(error?.message) : children
149 | 
150 |   if (!body) {
151 |     return null
152 |   }
153 | 
154 |   return (
155 |     <p
156 |       ref={ref}
157 |       id={formMessageId}
158 |       className={cn("text-sm font-medium text-destructive", className)}
159 |       {...props}
160 |     >
161 |       {body}
162 |     </p>
163 |   )
164 | })
165 | FormMessage.displayName = "FormMessage"
166 | 
167 | export {
168 |   useFormField,
169 |   Form,
170 |   FormItem,
171 |   FormLabel,
172 |   FormControl,
173 |   FormDescription,
174 |   FormMessage,
175 |   FormField,
176 | }
177 | 


--------------------------------------------------------------------------------
/src/components/ui/input.tsx:
--------------------------------------------------------------------------------
 1 | import * as React from "react"
 2 | 
 3 | import { cn } from "@/lib/utils"
 4 | 
 5 | export interface InputProps
 6 |   extends React.InputHTMLAttributes<HTMLInputElement> {}
 7 | 
 8 | const Input = React.forwardRef<HTMLInputElement, InputProps>(
 9 |   ({ className, type, ...props }, ref) => {
10 |     return (
11 |       <input
12 |         type={type}
13 |         className={cn(
14 |           "flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",
15 |           className
16 |         )}
17 |         ref={ref}
18 |         {...props}
19 |       />
20 |     )
21 |   }
22 | )
23 | Input.displayName = "Input"
24 | 
25 | export { Input }
26 | 


--------------------------------------------------------------------------------
/src/components/ui/label.tsx:
--------------------------------------------------------------------------------
 1 | "use client"
 2 | 
 3 | import * as React from "react"
 4 | import * as LabelPrimitive from "@radix-ui/react-label"
 5 | import { cva, type VariantProps } from "class-variance-authority"
 6 | 
 7 | import { cn } from "@/lib/utils"
 8 | 
 9 | const labelVariants = cva(
10 |   "text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
11 | )
12 | 
13 | const Label = React.forwardRef<
14 |   React.ElementRef<typeof LabelPrimitive.Root>,
15 |   React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
16 |     VariantProps<typeof labelVariants>
17 | >(({ className, ...props }, ref) => (
18 |   <LabelPrimitive.Root
19 |     ref={ref}
20 |     className={cn(labelVariants(), className)}
21 |     {...props}
22 |   />
23 | ))
24 | Label.displayName = LabelPrimitive.Root.displayName
25 | 
26 | export { Label }
27 | 


--------------------------------------------------------------------------------
/src/components/ui/toast.tsx:
--------------------------------------------------------------------------------
  1 | import * as React from "react"
  2 | import * as ToastPrimitives from "@radix-ui/react-toast"
  3 | import { cva, type VariantProps } from "class-variance-authority"
  4 | import { X } from "lucide-react"
  5 | 
  6 | import { cn } from "@/lib/utils"
  7 | 
  8 | const ToastProvider = ToastPrimitives.Provider
  9 | 
 10 | const ToastViewport = React.forwardRef<
 11 |   React.ElementRef<typeof ToastPrimitives.Viewport>,
 12 |   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Viewport>
 13 | >(({ className, ...props }, ref) => (
 14 |   <ToastPrimitives.Viewport
 15 |     ref={ref}
 16 |     className={cn(
 17 |       "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse p-4 sm:bottom-0 sm:right-0 sm:top-auto sm:flex-col md:max-w-[420px]",
 18 |       className
 19 |     )}
 20 |     {...props}
 21 |   />
 22 | ))
 23 | ToastViewport.displayName = ToastPrimitives.Viewport.displayName
 24 | 
 25 | const toastVariants = cva(
 26 |   "group pointer-events-auto relative flex w-full items-center justify-between space-x-4 overflow-hidden rounded-md border p-6 pr-8 shadow-lg transition-all data-[swipe=cancel]:translate-x-0 data-[swipe=end]:translate-x-[var(--radix-toast-swipe-end-x)] data-[swipe=move]:translate-x-[var(--radix-toast-swipe-move-x)] data-[swipe=move]:transition-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[swipe=end]:animate-out data-[state=closed]:fade-out-80 data-[state=closed]:slide-out-to-right-full data-[state=open]:slide-in-from-top-full data-[state=open]:sm:slide-in-from-bottom-full",
 27 |   {
 28 |     variants: {
 29 |       variant: {
 30 |         default: "border bg-background",
 31 |         destructive:
 32 |           "destructive group border-destructive bg-destructive text-destructive-foreground",
 33 |       },
 34 |     },
 35 |     defaultVariants: {
 36 |       variant: "default",
 37 |     },
 38 |   }
 39 | )
 40 | 
 41 | const Toast = React.forwardRef<
 42 |   React.ElementRef<typeof ToastPrimitives.Root>,
 43 |   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Root> &
 44 |     VariantProps<typeof toastVariants>
 45 | >(({ className, variant, ...props }, ref) => {
 46 |   return (
 47 |     <ToastPrimitives.Root
 48 |       ref={ref}
 49 |       className={cn(toastVariants({ variant }), className)}
 50 |       {...props}
 51 |     />
 52 |   )
 53 | })
 54 | Toast.displayName = ToastPrimitives.Root.displayName
 55 | 
 56 | const ToastAction = React.forwardRef<
 57 |   React.ElementRef<typeof ToastPrimitives.Action>,
 58 |   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Action>
 59 | >(({ className, ...props }, ref) => (
 60 |   <ToastPrimitives.Action
 61 |     ref={ref}
 62 |     className={cn(
 63 |       "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",
 64 |       className
 65 |     )}
 66 |     {...props}
 67 |   />
 68 | ))
 69 | ToastAction.displayName = ToastPrimitives.Action.displayName
 70 | 
 71 | const ToastClose = React.forwardRef<
 72 |   React.ElementRef<typeof ToastPrimitives.Close>,
 73 |   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Close>
 74 | >(({ className, ...props }, ref) => (
 75 |   <ToastPrimitives.Close
 76 |     ref={ref}
 77 |     className={cn(
 78 |       "absolute right-2 top-2 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 group-hover:opacity-100 group-[.destructive]:text-red-300 group-[.destructive]:hover:text-red-50 group-[.destructive]:focus:ring-red-400 group-[.destructive]:focus:ring-offset-red-600",
 79 |       className
 80 |     )}
 81 |     toast-close=""
 82 |     {...props}
 83 |   >
 84 |     <X className="h-4 w-4" />
 85 |   </ToastPrimitives.Close>
 86 | ))
 87 | ToastClose.displayName = ToastPrimitives.Close.displayName
 88 | 
 89 | const ToastTitle = React.forwardRef<
 90 |   React.ElementRef<typeof ToastPrimitives.Title>,
 91 |   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Title>
 92 | >(({ className, ...props }, ref) => (
 93 |   <ToastPrimitives.Title
 94 |     ref={ref}
 95 |     className={cn("text-sm font-semibold", className)}
 96 |     {...props}
 97 |   />
 98 | ))
 99 | ToastTitle.displayName = ToastPrimitives.Title.displayName
100 | 
101 | const ToastDescription = React.forwardRef<
102 |   React.ElementRef<typeof ToastPrimitives.Description>,
103 |   React.ComponentPropsWithoutRef<typeof ToastPrimitives.Description>
104 | >(({ className, ...props }, ref) => (
105 |   <ToastPrimitives.Description
106 |     ref={ref}
107 |     className={cn("text-sm opacity-90", className)}
108 |     {...props}
109 |   />
110 | ))
111 | ToastDescription.displayName = ToastPrimitives.Description.displayName
112 | 
113 | type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>
114 | 
115 | type ToastActionElement = React.ReactElement<typeof ToastAction>
116 | 
117 | export {
118 |   type ToastProps,
119 |   type ToastActionElement,
120 |   ToastProvider,
121 |   ToastViewport,
122 |   Toast,
123 |   ToastTitle,
124 |   ToastDescription,
125 |   ToastClose,
126 |   ToastAction,
127 | }
128 | 


--------------------------------------------------------------------------------
/src/components/ui/toaster.tsx:
--------------------------------------------------------------------------------
 1 | "use client"
 2 | 
 3 | import {
 4 |   Toast,
 5 |   ToastClose,
 6 |   ToastDescription,
 7 |   ToastProvider,
 8 |   ToastTitle,
 9 |   ToastViewport,
10 | } from "@/components/ui/toast"
11 | import { useToast } from "@/components/ui/use-toast"
12 | 
13 | export function Toaster() {
14 |   const { toasts } = useToast()
15 | 
16 |   return (
17 |     <ToastProvider>
18 |       {toasts.map(function ({ id, title, description, action, ...props }) {
19 |         return (
20 |           <Toast key={id} {...props}>
21 |             <div className="grid gap-1">
22 |               {title && <ToastTitle>{title}</ToastTitle>}
23 |               {description && (
24 |                 <ToastDescription>{description}</ToastDescription>
25 |               )}
26 |             </div>
27 |             {action}
28 |             <ToastClose />
29 |           </Toast>
30 |         )
31 |       })}
32 |       <ToastViewport />
33 |     </ToastProvider>
34 |   )
35 | }
36 | 


--------------------------------------------------------------------------------
/src/components/ui/use-toast.ts:
--------------------------------------------------------------------------------
  1 | // Inspired by react-hot-toast library
  2 | import * as React from "react"
  3 | 
  4 | import type {
  5 |   ToastActionElement,
  6 |   ToastProps,
  7 | } from "@/components/ui/toast"
  8 | 
  9 | const TOAST_LIMIT = 1
 10 | const TOAST_REMOVE_DELAY = 1000000
 11 | 
 12 | type ToasterToast = ToastProps & {
 13 |   id: string
 14 |   title?: React.ReactNode
 15 |   description?: React.ReactNode
 16 |   action?: ToastActionElement
 17 | }
 18 | 
 19 | const actionTypes = {
 20 |   ADD_TOAST: "ADD_TOAST",
 21 |   UPDATE_TOAST: "UPDATE_TOAST",
 22 |   DISMISS_TOAST: "DISMISS_TOAST",
 23 |   REMOVE_TOAST: "REMOVE_TOAST",
 24 | } as const
 25 | 
 26 | let count = 0
 27 | 
 28 | function genId() {
 29 |   count = (count + 1) % Number.MAX_VALUE
 30 |   return count.toString()
 31 | }
 32 | 
 33 | type ActionType = typeof actionTypes
 34 | 
 35 | type Action =
 36 |   | {
 37 |       type: ActionType["ADD_TOAST"]
 38 |       toast: ToasterToast
 39 |     }
 40 |   | {
 41 |       type: ActionType["UPDATE_TOAST"]
 42 |       toast: Partial<ToasterToast>
 43 |     }
 44 |   | {
 45 |       type: ActionType["DISMISS_TOAST"]
 46 |       toastId?: ToasterToast["id"]
 47 |     }
 48 |   | {
 49 |       type: ActionType["REMOVE_TOAST"]
 50 |       toastId?: ToasterToast["id"]
 51 |     }
 52 | 
 53 | interface State {
 54 |   toasts: ToasterToast[]
 55 | }
 56 | 
 57 | const toastTimeouts = new Map<string, ReturnType<typeof setTimeout>>()
 58 | 
 59 | const addToRemoveQueue = (toastId: string) => {
 60 |   if (toastTimeouts.has(toastId)) {
 61 |     return
 62 |   }
 63 | 
 64 |   const timeout = setTimeout(() => {
 65 |     toastTimeouts.delete(toastId)
 66 |     dispatch({
 67 |       type: "REMOVE_TOAST",
 68 |       toastId: toastId,
 69 |     })
 70 |   }, TOAST_REMOVE_DELAY)
 71 | 
 72 |   toastTimeouts.set(toastId, timeout)
 73 | }
 74 | 
 75 | export const reducer = (state: State, action: Action): State => {
 76 |   switch (action.type) {
 77 |     case "ADD_TOAST":
 78 |       return {
 79 |         ...state,
 80 |         toasts: [action.toast, ...state.toasts].slice(0, TOAST_LIMIT),
 81 |       }
 82 | 
 83 |     case "UPDATE_TOAST":
 84 |       return {
 85 |         ...state,
 86 |         toasts: state.toasts.map((t) =>
 87 |           t.id === action.toast.id ? { ...t, ...action.toast } : t
 88 |         ),
 89 |       }
 90 | 
 91 |     case "DISMISS_TOAST": {
 92 |       const { toastId } = action
 93 | 
 94 |       // ! Side effects ! - This could be extracted into a dismissToast() action,
 95 |       // but I'll keep it here for simplicity
 96 |       if (toastId) {
 97 |         addToRemoveQueue(toastId)
 98 |       } else {
 99 |         state.toasts.forEach((toast) => {
100 |           addToRemoveQueue(toast.id)
101 |         })
102 |       }
103 | 
104 |       return {
105 |         ...state,
106 |         toasts: state.toasts.map((t) =>
107 |           t.id === toastId || toastId === undefined
108 |             ? {
109 |                 ...t,
110 |                 open: false,
111 |               }
112 |             : t
113 |         ),
114 |       }
115 |     }
116 |     case "REMOVE_TOAST":
117 |       if (action.toastId === undefined) {
118 |         return {
119 |           ...state,
120 |           toasts: [],
121 |         }
122 |       }
123 |       return {
124 |         ...state,
125 |         toasts: state.toasts.filter((t) => t.id !== action.toastId),
126 |       }
127 |   }
128 | }
129 | 
130 | const listeners: Array<(state: State) => void> = []
131 | 
132 | let memoryState: State = { toasts: [] }
133 | 
134 | function dispatch(action: Action) {
135 |   memoryState = reducer(memoryState, action)
136 |   listeners.forEach((listener) => {
137 |     listener(memoryState)
138 |   })
139 | }
140 | 
141 | type Toast = Omit<ToasterToast, "id">
142 | 
143 | function toast({ ...props }: Toast) {
144 |   const id = genId()
145 | 
146 |   const update = (props: ToasterToast) =>
147 |     dispatch({
148 |       type: "UPDATE_TOAST",
149 |       toast: { ...props, id },
150 |     })
151 |   const dismiss = () => dispatch({ type: "DISMISS_TOAST", toastId: id })
152 | 
153 |   dispatch({
154 |     type: "ADD_TOAST",
155 |     toast: {
156 |       ...props,
157 |       id,
158 |       open: true,
159 |       onOpenChange: (open) => {
160 |         if (!open) dismiss()
161 |       },
162 |     },
163 |   })
164 | 
165 |   return {
166 |     id: id,
167 |     dismiss,
168 |     update,
169 |   }
170 | }
171 | 
172 | function useToast() {
173 |   const [state, setState] = React.useState<State>(memoryState)
174 | 
175 |   React.useEffect(() => {
176 |     listeners.push(setState)
177 |     return () => {
178 |       const index = listeners.indexOf(setState)
179 |       if (index > -1) {
180 |         listeners.splice(index, 1)
181 |       }
182 |     }
183 |   }, [state])
184 | 
185 |   return {
186 |     ...state,
187 |     toast,
188 |     dismiss: (toastId?: string) => dispatch({ type: "DISMISS_TOAST", toastId }),
189 |   }
190 | }
191 | 
192 | export { useToast, toast }
193 | 


--------------------------------------------------------------------------------
/src/db/index.ts:
--------------------------------------------------------------------------------
1 | import { neon, neonConfig } from "@neondatabase/serverless";
2 | import { drizzle } from "drizzle-orm/neon-http";
3 | import * as schema from "./schema";
4 | neonConfig.fetchConnectionCache = true;
5 | 
6 | const sql = neon(process.env.DRIZZLE_DATABASE_URL!);
7 | export const db = drizzle(sql, { schema });
8 | 


--------------------------------------------------------------------------------
/src/db/schema.ts:
--------------------------------------------------------------------------------
 1 | import {
 2 | 	timestamp,
 3 | 	pgTable,
 4 | 	text,
 5 | 	primaryKey,
 6 | 	integer,
 7 | 	uuid,
 8 | } from "drizzle-orm/pg-core";
 9 | import type { AdapterAccount } from "@auth/core/adapters";
10 | import { InferModel, relations } from "drizzle-orm";
11 | 
12 | export const users = pgTable("user", {
13 | 	id: text("id").notNull().primaryKey(),
14 | 	name: text("name"),
15 | 	email: text("email").notNull(),
16 | 	emailVerified: timestamp("emailVerified", { mode: "date" }),
17 | 	image: text("image"),
18 | 
19 | 	username: text("username").unique(),
20 | });
21 | 
22 | export type User = InferModel<typeof users>;
23 | 
24 | export const accounts = pgTable(
25 | 	"account",
26 | 	{
27 | 		userId: text("userId")
28 | 			.notNull()
29 | 			.references(() => users.id, { onDelete: "cascade" }),
30 | 		type: text("type").$type<AdapterAccount["type"]>().notNull(),
31 | 		provider: text("provider").notNull(),
32 | 		providerAccountId: text("providerAccountId").notNull(),
33 | 		refresh_token: text("refresh_token"),
34 | 		access_token: text("access_token"),
35 | 		expires_at: integer("expires_at"),
36 | 		token_type: text("token_type"),
37 | 		scope: text("scope"),
38 | 		id_token: text("id_token"),
39 | 		session_state: text("session_state"),
40 | 	},
41 | 	(account) => ({
42 | 		compoundKey: primaryKey(account.provider, account.providerAccountId),
43 | 	})
44 | );
45 | 
46 | export const sessions = pgTable("session", {
47 | 	sessionToken: text("sessionToken").notNull().primaryKey(),
48 | 	userId: text("userId")
49 | 		.notNull()
50 | 		.references(() => users.id, { onDelete: "cascade" }),
51 | 	expires: timestamp("expires", { mode: "date" }).notNull(),
52 | });
53 | 
54 | export const verificationTokens = pgTable(
55 | 	"verificationToken",
56 | 	{
57 | 		identifier: text("identifier").notNull(),
58 | 		token: text("token").notNull(),
59 | 		expires: timestamp("expires", { mode: "date" }).notNull(),
60 | 	},
61 | 	(vt) => ({
62 | 		compoundKey: primaryKey(vt.identifier, vt.token),
63 | 	})
64 | );
65 | export const threads = pgTable("thread", {
66 | 	id: uuid("id").defaultRandom().primaryKey(),
67 | 	text: text("text").notNull(),
68 | 	userId: text("user_id").notNull(),
69 | 	createdAt: timestamp("created_at", { mode: "date" }).defaultNow(),
70 | 	parentId: text("parent_id"),
71 | 	dialogue_id: uuid("dialogue_id"),
72 | });
73 | 
74 | export type Thread = InferModel<typeof threads>;
75 | 
76 | export const threadsRelations = relations(threads, ({ one }) => ({
77 | 	user: one(users, {
78 | 		fields: [threads.userId],
79 | 		references: [users.id],
80 | 	}),
81 | }));
82 | 
83 | export const userRelations = relations(users, ({ many }) => ({
84 | 	threads: many(threads),
85 | }));
86 | 


--------------------------------------------------------------------------------
/src/lib/auth.ts:
--------------------------------------------------------------------------------
 1 | import { NextAuthOptions, getServerSession } from "next-auth";
 2 | import GoogleProvider from "next-auth/providers/google";
 3 | import { DrizzleAdapter } from "@auth/drizzle-adapter";
 4 | import { db } from "@/db";
 5 | import "dotenv/config";
 6 | import { users } from "@/db/schema";
 7 | import { eq } from "drizzle-orm";
 8 | import { nanoid } from "nanoid";
 9 | export const authOptions: NextAuthOptions = {
10 | 	// @ts-ignore
11 | 	adapter: DrizzleAdapter(db),
12 | 	secret: process.env.NEXTAUTH_SECRET!,
13 | 	providers: [
14 | 		GoogleProvider({
15 | 			clientId: process.env.GOOGLE_CLIENT_ID!,
16 | 			clientSecret: process.env.GOOGLE_CLIENT_SECRET!,
17 | 		}),
18 | 	],
19 | 	pages: {
20 | 		signIn: "/sign-in",
21 | 	},
22 | 	session: {
23 | 		strategy: "jwt",
24 | 	},
25 | 	callbacks: {
26 | 		async session({ session, token }) {
27 | 			// do something to session
28 | 			if (token) {
29 | 				session.user.id = token.id;
30 | 				session.user.username = token.username;
31 | 				session.user.email = token.email;
32 | 				session.user.name = token.name;
33 | 				session.user.image = token.image as string;
34 | 			}
35 | 			return session;
36 | 		},
37 | 		async jwt({ token, user }) {
38 | 			const email = token.email;
39 | 
40 | 			const dbUser = (
41 | 				await db
42 | 					.select()
43 | 					.from(users)
44 | 					.where(eq(users.email, email as string))
45 | 			)[0];
46 | 
47 | 			if (!dbUser) {
48 | 				token.id = user.id;
49 | 				return token;
50 | 			}
51 | 			if (!dbUser.username) {
52 | 				await db
53 | 					.update(users)
54 | 					.set({ username: nanoid(10) })
55 | 					.where(eq(users.id, dbUser.id));
56 | 			}
57 | 
58 | 			return {
59 | 				id: dbUser.id,
60 | 				email: dbUser.email,
61 | 				username: dbUser.username,
62 | 				name: dbUser.name,
63 | 				image: dbUser.image,
64 | 			};
65 | 		},
66 | 	},
67 | };
68 | 
69 | export const getAuthSession = () => getServerSession(authOptions);
70 | 


--------------------------------------------------------------------------------
/src/lib/utils.ts:
--------------------------------------------------------------------------------
 1 | import { type ClassValue, clsx } from "clsx";
 2 | import { toast } from "sonner";
 3 | import { twMerge } from "tailwind-merge";
 4 | import { z } from "zod";
 5 | export function cn(...inputs: ClassValue[]) {
 6 | 	return twMerge(clsx(inputs));
 7 | }
 8 | 
 9 | export function catchError(err: unknown) {
10 | 	if (err instanceof z.ZodError) {
11 | 		const errors = err.issues.map((issue) => {
12 | 			return issue.message;
13 | 		});
14 | 		return toast(errors.join("\n"));
15 | 	} else if (err instanceof Error) {
16 | 		return toast.error(err.message);
17 | 	} else {
18 | 		return toast("Something went wrong, please try again later.");
19 | 	}
20 | }
21 | 


--------------------------------------------------------------------------------
/src/store/useLoginDialogStore.ts:
--------------------------------------------------------------------------------
 1 | import { create } from "zustand";
 2 | 
 3 | type Store = {
 4 | 	open: boolean;
 5 | };
 6 | 
 7 | type Actions = {
 8 | 	setOpen: (input: boolean) => void;
 9 | };
10 | 
11 | export const useLogInDialog = create<Store & Actions>((set) => ({
12 | 	open: false,
13 | 	setOpen: (open: boolean) => set({ open }),
14 | }));
15 | 


--------------------------------------------------------------------------------
/src/types/next-auth.d.ts:
--------------------------------------------------------------------------------
 1 | import type { Session, User } from "next-auth";
 2 | import type { JWT } from "next-auth/jwt";
 3 | 
 4 | type UserId = string;
 5 | 
 6 | declare module "next-auth/jwt" {
 7 | 	interface JWT {
 8 | 		id: UserId;
 9 | 		username?: string | null;
10 | 	}
11 | }
12 | 
13 | declare module "next-auth" {
14 | 	interface Session {
15 | 		user: User & {
16 | 			id: UserId;
17 | 			username?: string | null;
18 | 			name? : string | null;
19 |             image? : string | null;
20 | 		};
21 | 	}
22 | }


--------------------------------------------------------------------------------
/src/validations/thread.ts:
--------------------------------------------------------------------------------
 1 | import { z } from "zod";
 2 | 
 3 | export const addThreadSchema = z.object({
 4 | 	text: z.string().min(1, "Write a tweet bro").nonempty(),
 5 | 	dialogueId: z.string(),
 6 | });
 7 | export const addThreadsSchema = z.object({
 8 | 	threads: z.array(addThreadSchema),
 9 | });
10 | 


--------------------------------------------------------------------------------
/tailwind.config.js:
--------------------------------------------------------------------------------
 1 | /** @type {import('tailwindcss').Config} */
 2 | module.exports = {
 3 |   darkMode: ["class"],
 4 |   content: [
 5 |     './pages/**/*.{ts,tsx}',
 6 |     './components/**/*.{ts,tsx}',
 7 |     './app/**/*.{ts,tsx}',
 8 |     './src/**/*.{ts,tsx}',
 9 | 	],
10 |   theme: {
11 |     container: {
12 |       center: true,
13 |       padding: "2rem",
14 |       screens: {
15 |         "2xl": "1400px",
16 |       },
17 |     },
18 |     extend: {
19 |       colors: {
20 |         border: "hsl(var(--border))",
21 |         input: "hsl(var(--input))",
22 |         ring: "hsl(var(--ring))",
23 |         background: "hsl(var(--background))",
24 |         foreground: "hsl(var(--foreground))",
25 |         primary: {
26 |           DEFAULT: "hsl(var(--primary))",
27 |           foreground: "hsl(var(--primary-foreground))",
28 |         },
29 |         secondary: {
30 |           DEFAULT: "hsl(var(--secondary))",
31 |           foreground: "hsl(var(--secondary-foreground))",
32 |         },
33 |         destructive: {
34 |           DEFAULT: "hsl(var(--destructive))",
35 |           foreground: "hsl(var(--destructive-foreground))",
36 |         },
37 |         muted: {
38 |           DEFAULT: "hsl(var(--muted))",
39 |           foreground: "hsl(var(--muted-foreground))",
40 |         },
41 |         accent: {
42 |           DEFAULT: "hsl(var(--accent))",
43 |           foreground: "hsl(var(--accent-foreground))",
44 |         },
45 |         popover: {
46 |           DEFAULT: "hsl(var(--popover))",
47 |           foreground: "hsl(var(--popover-foreground))",
48 |         },
49 |         card: {
50 |           DEFAULT: "hsl(var(--card))",
51 |           foreground: "hsl(var(--card-foreground))",
52 |         },
53 |       },
54 |       borderRadius: {
55 |         lg: "var(--radius)",
56 |         md: "calc(var(--radius) - 2px)",
57 |         sm: "calc(var(--radius) - 4px)",
58 |       },
59 |       keyframes: {
60 |         "accordion-down": {
61 |           from: { height: 0 },
62 |           to: { height: "var(--radix-accordion-content-height)" },
63 |         },
64 |         "accordion-up": {
65 |           from: { height: "var(--radix-accordion-content-height)" },
66 |           to: { height: 0 },
67 |         },
68 |       },
69 |       animation: {
70 |         "accordion-down": "accordion-down 0.2s ease-out",
71 |         "accordion-up": "accordion-up 0.2s ease-out",
72 |       },
73 |     },
74 |   },
75 |   plugins: [require("tailwindcss-animate")],
76 | }


--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "compilerOptions": {
 3 |     "target": "es6",
 4 |     "lib": ["dom", "dom.iterable", "esnext"],
 5 |     "allowJs": true,
 6 |     "skipLibCheck": true,
 7 |     "strict": true,
 8 |     "forceConsistentCasingInFileNames": true,
 9 |     "noEmit": true,
10 |     "esModuleInterop": true,
11 |     "module": "esnext",
12 |     "moduleResolution": "bundler",
13 |     "resolveJsonModule": true,
14 |     "isolatedModules": true,
15 |     "jsx": "preserve",
16 |     "incremental": true,
17 |     "plugins": [
18 |       {
19 |         "name": "next"
20 |       }
21 |     ],
22 |     "paths": {
23 |       "@/*": ["./src/*"]
24 |     }
25 |   },
26 |   "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
27 |   "exclude": ["node_modules"]
28 | }
29 | 


--------------------------------------------------------------------------------