chore: update readme

README.md

@@ -1,29 +1,46 @@
-# Create T3 App
+# [CSV Importer](https://importer.sadmn.com)
 
-This is a [T3 Stack](https://create.t3.gg/) project bootstrapped with `create-t3-app`.
+This is a csv-importer built with `shadnc/ui`, `radix ui`, `react-dropzone`, and `papaparse`. It is bootstrapped with `create-t3-app`.
 
-## What's next? How do I make an app with this?
+[![CSV Importer](./public/images/screenshot.png)](https://importer.sadmn.com)
 
-We try to keep this project as simple as possible, so you can start with just the scaffolding we set up for you, and add additional things later when they become necessary.
+## Tech Stack
 
-If you are not familiar with the different technologies used in this project, please refer to the respective docs. If you still are in the wind, please join our [Discord](https://t3.gg/discord) and ask for help.
+- **Framework:** [Next.js](https://nextjs.org)
+- **Styling:** [Tailwind CSS](https://tailwindcss.com)
+- **UI Components:** [shadcn/ui](https://ui.shadcn.com)
+- **DND Uploader:** [react-dropzone](https://react-dropzone.js.org/)
+- **Storage:** [uploadthing](https://uploadthing.com)
+- **CSV Parsing:** [Papaparse](https://www.papaparse.com)
 
-- [Next.js](https://nextjs.org)
-- [NextAuth.js](https://next-auth.js.org)
-- [Prisma](https://prisma.io)
-- [Drizzle](https://orm.drizzle.team)
-- [Tailwind CSS](https://tailwindcss.com)
-- [tRPC](https://trpc.io)
+## Features
 
-## Learn More
+- [x] Upload CSV file
+- [x] Parse CSV file
+- [x] Preview CSV file in a table
+- [x] Map CSV fields to corresponding table fields
+- [x] Import CSV data to database
 
-To learn more about the [T3 Stack](https://create.t3.gg/), take a look at the following resources:
+## Running Locally
 
-- [Documentation](https://create.t3.gg/)
-- [Learn the T3 Stack](https://create.t3.gg/en/faq#what-learning-resources-are-currently-available) — Check out these awesome tutorials
+1. Clone the repository
 
-You can check out the [create-t3-app GitHub repository](https://github.com/t3-oss/create-t3-app) — your feedback and contributions are welcome!
+   ```bash
+   git clone https://github.com/sadmann7/csv-importer
+   ```
+
+2. Install dependencies using pnpm
+
+   ```bash
+   pnpm install
+   ```
+
+3. Start the development server
+
+   ```bash
+   pnpm run dev
+   ```
 
 ## How do I deploy this?
 
-Follow our deployment guides for [Vercel](https://create.t3.gg/en/deployment/vercel), [Netlify](https://create.t3.gg/en/deployment/netlify) and [Docker](https://create.t3.gg/en/deployment/docker) for more information.
+Follow the deployment guides for [Vercel](https://create.t3.gg/en/deployment/vercel), [Netlify](https://create.t3.gg/en/deployment/netlify) and [Docker](https://create.t3.gg/en/deployment/docker) for more information.

public/site.webmanifest

@@ -1,6 +1,6 @@
 {
-  "name": "Csv Importer",
-  "short_name": "Csv Importer",
+  "name": "CSV Importer",
+  "short_name": "CSV Importer",
   "icons": [
     {
       "src": "/icon.png",

src/app/layout.tsx

@@ -22,10 +22,8 @@ export const metadata: Metadata = {
     "nextjs",
     "react",
     "react server components",
-    "table",
-    "react-table",
-    "tanstack-table",
-    "shadcn-table",
+    "importer",
+    "csv-importer",
   ],
   authors: [
     {

src/components/csv-importer.tsx

@@ -108,7 +108,7 @@ export function CsvImporter({
       {step === "upload" ? (
         <DialogContent className="p-8 sm:max-w-xl">
           <DialogHeader>
-            <DialogTitle>Import CSV</DialogTitle>
+            <DialogTitle>Upload CSV</DialogTitle>
             <DialogDescription>
               Drag and drop your files here or click to browse.
             </DialogDescription>
@@ -144,9 +144,9 @@ export function CsvImporter({
         <DialogContent className="overflow-hidden p-8 sm:max-w-6xl">
           <div className="flex flex-col items-center gap-2 sm:flex-row">
             <DialogHeader className="flex-1">
-              <DialogTitle>Map Fields</DialogTitle>
+              <DialogTitle>Map fields</DialogTitle>
               <DialogDescription>
-                Map the CSV fields to the database fields
+                Map the CSV fields to the corresponding table fields.
               </DialogDescription>
             </DialogHeader>
             <Button

src/components/ui/checkbox.tsx

@@ -13,15 +13,15 @@ const Checkbox = React.forwardRef<
   <CheckboxPrimitive.Root
     ref={ref}
     className={cn(
-      "peer h-4 w-4 shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+      "peer size-4 shrink-0 rounded-sm border border-primary shadow focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
       className
     )}
     {...props}
   >
     <CheckboxPrimitive.Indicator
       className={cn("flex items-center justify-center text-current")}
     >
-      <CheckIcon className="h-4 w-4" />
+      <CheckIcon className="size-4" />
     </CheckboxPrimitive.Indicator>
   </CheckboxPrimitive.Root>
 ))

src/config/site.ts

@@ -3,9 +3,9 @@ import { absoluteUrl } from "@/lib/utils"
 export type SiteConfig = typeof siteConfig
 
 export const siteConfig = {
-  name: "Csv Importer",
+  name: "CSV Importer",
   description:
-    "A csv importer built with shadcn-ui, react-dropzone, and papaparse",
-  url: absoluteUrl("/"),
+    "CSV importer built with shadcn-ui, react-dropzone, and papaparse.",
+  url: absoluteUrl(""),
   links: { github: "https://github.com/sadmann7/csv-importer" },
 }

src/hooks/use-parse-csv.ts

@@ -99,7 +99,7 @@ export function useParseCsv({
                 return null
               }
             }
-            return column.trim() === "" ? `Column ${index + 1}` : column
+            return column.trim() === "" ? `Field ${index + 1}` : column
           })
           .filter((column) => column !== null)