Moved to Next js

.gitignore

@@ -3,19 +3,19 @@
 # dependencies
 /node_modules
 /.pnp
-.pnp.js
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/versions
 
 # testing
 /coverage
 
-# database
-/prisma/db.sqlite
-/prisma/db.sqlite-journal
-
 # next.js
 /.next/
 /out/
-next-env.d.ts
 
 # production
 /build
@@ -30,14 +30,12 @@ yarn-debug.log*
 yarn-error.log*
 .pnpm-debug.log*
 
-# local env files
-# do not commit any .env files to git, except for the .env.example file. https://create.t3.gg/en/usage/env-variables#using-environment-variables
-.env
-.env*.local
+# env files (can opt-in for committing if needed)
+.env*
 
 # vercel
 .vercel
 
 # typescript
 *.tsbuildinfo
-docker-compose.yaml
+next-env.d.ts

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "typescript.tsdk": "node_modules\\typescript\\lib"
+}

README.md

@@ -1,57 +1,36 @@
-# Dungeons-and-Dragons-ToolBox
+This is a [Next.js](https://nextjs.org) project bootstrapped with [`create-next-app`](https://nextjs.org/docs/app/api-reference/cli/create-next-app).
 
-- [Dungeons-and-Dragons-ToolBox](#dungeons-and-dragons-toolbox)
-  - [Project Description](#project-description)
-  - [Installation](#installation)
-  - [Usage](#usage)
-  - [Technologies Used](#technologies-used)
-  - [Contributing Guidelines](#contributing-guidelines)
-  - [License](#license)
-  - [Code of Conduct](#code-of-conduct)
+## Getting Started
 
-## Project Description
+First, run the development server:
 
-Dungeons-and-Dragons-ToolBox is a hobby project aimed at providing players and Dungeon Masters (DMs) with a collection of resources and tools for playing Dungeons & Dragons. Whether you're looking for character generators, dice rollers, or reference materials, this website aims to be your go-to destination.
+```bash
+npm run dev
+# or
+yarn dev
+# or
+pnpm dev
+# or
+bun dev
+```
 
-## Installation
+Open [http://localhost:3000](http://localhost:3000) with your browser to see the result.
 
-Make sure you have Node.js version 20.0.9 or higher installed on your system. Then, follow these steps:
+You can start editing the page by modifying `app/page.tsx`. The page auto-updates as you edit the file.
 
-1. Clone this repository to your local machine.
-2. Navigate to the project directory in your terminal.
-3. Run `npm install` to install dependencies.
+This project uses [`next/font`](https://nextjs.org/docs/app/building-your-application/optimizing/fonts) to automatically optimize and load [Geist](https://vercel.com/font), a new font family for Vercel.
 
-## Usage
+## Learn More
 
-To run the project locally, you can use the following npm scripts:
+To learn more about Next.js, take a look at the following resources:
 
-| Command               | Description                     |
-| --------------------- | ------------------------------- |
-| `npm run build`       | Builds the Next.js application. |
-| `npm run dev`         | Starts the development server.  |
-| `npm run postinstall` | Generates Prisma client.        |
-| `npm run lint`        | Lints the project files.        |
-| `npm start`           | Starts the production server.   |
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
 
-For environment variables, refer to the `.env.example` file.
+You can check out [the Next.js GitHub repository](https://github.com/vercel/next.js) - your feedback and contributions are welcome!
 
-## Technologies Used
+## Deploy on Vercel
 
-This is a [T3 Stack](https://create.t3.gg/) project bootstrapped with `create-t3-app`.
+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.
 
-- Next.js
-- Prisma
-- Tailwind CSS
-- [Heroicons](https://heroicons.com/)
-
-## Contributing Guidelines
-
-Please refer to our [Contributing Guidelines](.github\CODE_OF_CONDUCT.md) for information on how to contribute to this project.
-
-## License
-
-I am using the [MIT LICENSE](/LICENSE) for this project.
-
-## Code of Conduct
-
-Please refer to our [Code of Conduct](.github\CODE_OF_CONDUCT.md) for information on our standards of behavior.
+Check out our [Next.js deployment documentation](https://nextjs.org/docs/app/building-your-application/deploying) for more details.

app/campaign-manager/page.tsx

@@ -0,0 +1,102 @@
+"use client";
+
+import { useState } from "react";
+import { Input } from "@/components/ui/input";
+import { Button } from "@/components/ui/button";
+import { Textarea } from "@/components/ui/textarea";
+import {
+    Card,
+    CardContent,
+    CardFooter,
+    CardHeader,
+    CardTitle,
+} from "@/components/ui/card";
+import {
+    Dialog,
+    DialogContent,
+    DialogDescription,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
+    DialogTrigger,
+} from "@/components/ui/dialog";
+
+type Campaign = {
+    id: number;
+    name: string;
+    description: string;
+};
+
+export default function CampaignManager() {
+    const [campaigns, setCampaigns] = useState<Campaign[]>([]);
+    const [newCampaign, setNewCampaign] = useState({
+        name: "",
+        description: "",
+    });
+
+    const addCampaign = () => {
+        if (newCampaign.name) {
+            setCampaigns([...campaigns, { ...newCampaign, id: Date.now() }]);
+            setNewCampaign({ name: "", description: "" });
+        }
+    };
+
+    return (
+        <div className="container mx-auto px-4 py-8">
+            <h1 className="text-3xl font-bold mb-6">Campaign Manager</h1>
+            <Dialog>
+                <DialogTrigger asChild>
+                    <Button className="mb-6">Create New Campaign</Button>
+                </DialogTrigger>
+                <DialogContent className="sm:max-w-[425px]">
+                    <DialogHeader>
+                        <DialogTitle>Create New Campaign</DialogTitle>
+                        <DialogDescription>
+                            Enter the details of your new campaign here.
+                        </DialogDescription>
+                    </DialogHeader>
+                    <div className="grid gap-4 py-4">
+                        <Input
+                            placeholder="Campaign Name"
+                            value={newCampaign.name}
+                            onChange={(e) =>
+                                setNewCampaign({
+                                    ...newCampaign,
+                                    name: e.target.value,
+                                })
+                            }
+                        />
+                        <Textarea
+                            placeholder="Campaign Description"
+                            value={newCampaign.description}
+                            onChange={(e) =>
+                                setNewCampaign({
+                                    ...newCampaign,
+                                    description: e.target.value,
+                                })
+                            }
+                        />
+                    </div>
+                    <DialogFooter>
+                        <Button onClick={addCampaign}>Create Campaign</Button>
+                    </DialogFooter>
+                </DialogContent>
+            </Dialog>
+            <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
+                {campaigns.map((campaign) => (
+                    <Card key={campaign.id}>
+                        <CardHeader>
+                            <CardTitle>{campaign.name}</CardTitle>
+                        </CardHeader>
+                        <CardContent>
+                            <p>{campaign.description}</p>
+                        </CardContent>
+                        <CardFooter>
+                            <Button variant="outline">Manage Campaign</Button>
+                        </CardFooter>
+                    </Card>
+                ))}
+            </div>
+        </div>
+    );
+}

app/character-creator/page.tsx

@@ -0,0 +1,15 @@
+import { CharacterCreator } from "@/components/character-creator";
+
+export default function CharacterCreatorPage() {
+    return (
+        <div className="max-w-2xl mx-auto">
+            <h1 className="text-3xl font-bold mb-4">Character Creator</h1>
+            <p className="mb-4">
+                Create your D&D character by filling out the form below. Choose
+                your characters name, class, race, alignment, and set their
+                ability scores.
+            </p>
+            <CharacterCreator />
+        </div>
+    );
+}