z1glr/golunteer
1
0
Fork 0
Code Issues Actions Packages Projects Releases Wiki Activity

started work on availability-color-selector

Browse Source
This commit is contained in:
z1glr
2025-01-17 21:58:17 +00:00
parent a3c6fd685d
commit e37310b774
22 changed files with 9961 additions and 9155 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18922
client/package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

72
client/package.json
View File

@@ -1,38 +1,38 @@
{ {
"name": "client", "name": "client",
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"scripts": { "scripts": {
"dev": "next dev --turbopack", "dev": "next dev --turbopack",
"build": "next build", "build": "next build",
"start": "next start", "start": "next start",
"lint": "next lint" "lint": "next lint"
}, },
"dependencies": { "dependencies": {
"@carbon/icons-react": "^11.53.0", "@carbon/icons-react": "^11.53.0",
"@internationalized/date": "^3.6.0", "@internationalized/date": "^3.6.0",
"@nextui-org/react": "^2.6.11", "@heroui/react": "2.6.13",
"@nextui-org/system": "^2.4.6", "@heroui/system": "2.4.6",
"@nextui-org/theme": "^2.4.5", "@heroui/theme": "2.4.5",
"@react-aria/i18n": "^3.12.4", "@react-aria/i18n": "^3.12.4",
"@react-stately/data": "^3.12.0", "@react-stately/data": "^3.12.0",
"framer-motion": "^11.15.0", "framer-motion": "^11.15.0",
"next": "15.1.3", "next": "15.1.3",
"react": "^19.0.0", "react": "^19.0.0",
"react-dom": "^19.0.0", "react-dom": "^19.0.0",
"zustand": "^5.0.2" "zustand": "^5.0.2"
}, },
"devDependencies": { "devDependencies": {
"@eslint/eslintrc": "^3", "@eslint/eslintrc": "^3",
"@types/node": "^20", "@types/node": "^20",
"@types/react": "^19", "@types/react": "^19",
"@types/react-dom": "^19", "@types/react-dom": "^19",
"eslint": "^9", "eslint": "^9",
"eslint-config-next": "15.1.3", "eslint-config-next": "15.1.3",
"postcss": "^8", "postcss": "^8",
"prettier": "^3.4.2", "prettier": "^3.4.2",
"prettier-plugin-tailwindcss": "^0.6.9", "prettier-plugin-tailwindcss": "^0.6.9",
"tailwindcss": "^3.4.1", "tailwindcss": "^3.4.1",
"typescript": "^5" "typescript": "^5"
} }
} }

2
client/src/app/Footer.tsx
View File

@@ -3,7 +3,7 @@
import { usePathname } from "next/navigation"; import { usePathname } from "next/navigation";
import React from "react"; import React from "react";
import { SiteLink } from "./layout"; import { SiteLink } from "./layout";
import { Divider, Link } from "@nextui-org/react"; import { Divider, Link } from "@heroui/react";
export default function Footer({ sites }: { sites: SiteLink[] }) { export default function Footer({ sites }: { sites: SiteLink[] }) {
const pathname = usePathname(); const pathname = usePathname();

2
client/src/app/Header.tsx
View File

@@ -18,7 +18,7 @@ import {
NavbarMenuToggle, NavbarMenuToggle,
Tab, Tab,
Tabs, Tabs,
} from "@nextui-org/react"; } from "@heroui/react";
import zustand from "@/Zustand"; import zustand from "@/Zustand";
import { SiteLink } from "./layout"; import { SiteLink } from "./layout";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";

2
client/src/app/Main.tsx
View File

@@ -2,7 +2,7 @@
import { apiCall } from "@/lib"; import { apiCall } from "@/lib";
import zustand from "@/Zustand"; import zustand from "@/Zustand";
import { Spinner } from "@nextui-org/react"; import { Spinner } from "@heroui/react";
import { usePathname, useRouter } from "next/navigation"; import { usePathname, useRouter } from "next/navigation";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";

2
client/src/app/Overview.tsx
View File

@@ -3,7 +3,7 @@
import { Add } from "@carbon/icons-react"; import { Add } from "@carbon/icons-react";
import { useState } from "react"; import { useState } from "react";
import AddEvent from "../components/Event/AddEvent"; import AddEvent from "../components/Event/AddEvent";
import { Button } from "@nextui-org/react"; import { Button } from "@heroui/react";
export default function EventVolunteer() { export default function EventVolunteer() {
const [showAddItemDialogue, setShowAddItemDialogue] = useState(false); const [showAddItemDialogue, setShowAddItemDialogue] = useState(false);

2
client/src/app/account/page.tsx
View File

@@ -9,7 +9,7 @@ import {
CardHeader, CardHeader,
Form, Form,
Input, Input,
} from "@nextui-org/react"; } from "@heroui/react";
import { FormEvent, useState } from "react"; import { FormEvent, useState } from "react";
export default function Account() { export default function Account() {

2
client/src/app/admin/AddUser.tsx
View File

@@ -9,7 +9,7 @@ import {
ModalContent, ModalContent,
ModalFooter, ModalFooter,
ModalHeader, ModalHeader,
} from "@nextui-org/react"; } from "@heroui/react";
import { FormEvent, useState } from "react"; import { FormEvent, useState } from "react";
export default function AddUser(props: { export default function AddUser(props: {

9
client/src/app/admin/Availabilities.tsx Normal file
View File

@@ -0,0 +1,9 @@
import ColorSelector from "@/components/Colorselector";
export default function Availabilities() {
return (
<div>
<ColorSelector />
</div>
);
}

2
client/src/app/admin/EditUser.tsx
View File

@@ -14,7 +14,7 @@ import {
ModalContent, ModalContent,
ModalFooter, ModalFooter,
ModalHeader, ModalHeader,
} from "@nextui-org/react"; } from "@heroui/react";
import { FormEvent, useEffect, useState } from "react"; import { FormEvent, useEffect, useState } from "react";
export default function EditUser(props: { export default function EditUser(props: {

2
client/src/app/admin/Users.tsx
View File

@@ -10,7 +10,7 @@ import {
TableHeader, TableHeader,
TableRow, TableRow,
Tooltip, Tooltip,
} from "@nextui-org/react"; } from "@heroui/react";
import { useAsyncList } from "@react-stately/data"; import { useAsyncList } from "@react-stately/data";
import { FormEvent, useState } from "react"; import { FormEvent, useState } from "react";
import AddUser from "./AddUser"; import AddUser from "./AddUser";

5
client/src/app/admin/page.tsx
View File

@@ -1,7 +1,8 @@
"use client"; "use client";
import { Tab, Tabs } from "@nextui-org/react"; import { Tab, Tabs } from "@heroui/react";
import Users from "./Users"; import Users from "./Users";
import Availabilities from "./Availabilities";
export default function AdminDashboard() { export default function AdminDashboard() {
return ( return (
@@ -11,7 +12,7 @@ export default function AdminDashboard() {
<Users /> <Users />
</Tab> </Tab>
<Tab title="Tasks">Tasks</Tab> <Tab title="Tasks">Tasks</Tab>
<Tab title="Availabilities">Availabilities</Tab> <Tab title="Availabilities"><Availabilities /></Tab>
</Tabs> </Tabs>
</div> </div>
); );

2
client/src/app/assignments/page.tsx
View File

@@ -34,7 +34,7 @@ import {
TableHeader, TableHeader,
TableRow, TableRow,
Tooltip, Tooltip,
} from "@nextui-org/react"; } from "@heroui/react";
import { useAsyncList } from "@react-stately/data"; import { useAsyncList } from "@react-stately/data";
import React, { Key, useState } from "react"; import React, { Key, useState } from "react";

2
client/src/app/events/page.tsx
View File

@@ -5,7 +5,7 @@ import Event from "@/components/Event/Event";
import { apiCall } from "@/lib"; import { apiCall } from "@/lib";
import zustand, { EventData } from "@/Zustand"; import zustand, { EventData } from "@/Zustand";
import { Add } from "@carbon/icons-react"; import { Add } from "@carbon/icons-react";
import { Button } from "@nextui-org/react"; import { Button } from "@heroui/react";
import { useEffect, useState } from "react"; import { useEffect, useState } from "react";
export default function Events() { export default function Events() {

6
client/src/app/layout.tsx
View File

@@ -1,6 +1,6 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import "./globals.css"; import "./globals.css";
import { NextUIProvider } from "@nextui-org/system"; import { HeroUIProvider } from "@heroui/system";
import React from "react"; import React from "react";
import Footer from "./Footer"; import Footer from "./Footer";
import Header from "./Header"; import Header from "./Header";
@@ -57,7 +57,7 @@ export default function RootLayout({
return ( return (
<html> <html>
<body className="bg-background text-foreground antialiased"> <body className="bg-background text-foreground antialiased">
<NextUIProvider> <HeroUIProvider>
<div className="flex min-h-screen flex-col p-4"> <div className="flex min-h-screen flex-col p-4">
<header> <header>
<Header sites={headerSites} /> <Header sites={headerSites} />
@@ -69,7 +69,7 @@ export default function RootLayout({
<Footer sites={footerSites} /> <Footer sites={footerSites} />
</footer> </footer>
</div> </div>
</NextUIProvider> </HeroUIProvider>
</body> </body>
</html> </html>
); );

2
client/src/app/login/page.tsx
View File

@@ -8,7 +8,7 @@ import {
ViewOffFilled, ViewOffFilled,
WarningHexFilled, WarningHexFilled,
} from "@carbon/icons-react"; } from "@carbon/icons-react";
import { Alert, Button, Form, Input } from "@nextui-org/react"; import { Alert, Button, Form, Input } from "@heroui/react";
import { useRouter } from "next/navigation"; import { useRouter } from "next/navigation";
import { FormEvent, useState } from "react"; import { FormEvent, useState } from "react";

2
client/src/components/CheckboxIcon.tsx
View File

@@ -1,4 +1,4 @@
import { SwitchProps, useSwitch, VisuallyHidden } from "@nextui-org/react"; import { SwitchProps, useSwitch, VisuallyHidden } from "@heroui/react";
import React from "react"; import React from "react";
export default function CheckboxIcon(props: SwitchProps) { export default function CheckboxIcon(props: SwitchProps) {

58
client/src/components/Colorselector.tsx Normal file
View File

@@ -0,0 +1,58 @@
import {
RadioGroup,
RadioProps,
useRadio,
VisuallyHidden,
} from "@heroui/react";
export default function ColorSelector() {
const colors = [
{ value: "Red", tailwind: "red-600" },
{ value: "Orange", tailwind: "orange-600" },
{ value: "Amber", tailwind: "amber-600" },
{ value: "Yellow", tailwind: "yellow-600" },
{ value: "Lime", tailwind: "lime-600" },
{ value: "Green", tailwind: "green-600" },
{ value: "Emerald", tailwind: "emerald-600" },
{ value: "Teal", tailwind: "teal-600" },
{ value: "Cyan", tailwind: "cyan-600" },
{ value: "Sky", tailwind: "sky-600" },
{ value: "Blue", tailwind: "blue-600" },
{ value: "Indigo", tailwind: "indigo-600" },
{ value: "Violet", tailwind: "violet-600" },
{ value: "Purple", tailwind: "purple-600" },
{ value: "Fuchsia", tailwind: "fuchsia-600" },
{ value: "Pink", tailwind: "pink-600" },
];
return (
<RadioGroup classNames={{ wrapper: "grid grid-cols-4" }}>
{colors.map((color) => (
<ColorRadio
description={color.value}
value={color.value}
key={color.value}
radioColor={`bg-${color.tailwind}`}
>
<div>{color.value}</div>
</ColorRadio>
))}
</RadioGroup>
);
}
function ColorRadio(props: { radioColor: string } & RadioProps) {
const { Component, children, getBaseProps, getInputProps } = useRadio(props);
return (
<Component
{...getBaseProps()}
className={`aspect-square cursor-pointer rounded-lg border-2 border-default tap-highlight-transparent hover:opacity-70 active:opacity-50 data-[selected=true]:border-primary ${props.radioColor} flex items-center justify-center p-1`}
>
<VisuallyHidden>
<input {...getInputProps()} />
</VisuallyHidden>
{children}
</Component>
);
}

2
client/src/components/Event/AddEvent.tsx
View File

@@ -1,4 +1,4 @@
import { Button } from "@nextui-org/react"; import { Button } from "@heroui/react";
import EditEvent, { EventSubmitData } from "./EditEvent"; import EditEvent, { EventSubmitData } from "./EditEvent";
import { apiCall } from "@/lib"; import { apiCall } from "@/lib";
import { AddLarge } from "@carbon/icons-react"; import { AddLarge } from "@carbon/icons-react";

2
client/src/components/Event/EditEvent.tsx
View File

@@ -18,7 +18,7 @@ import {
ModalHeader, ModalHeader,
Spinner, Spinner,
Textarea, Textarea,
} from "@nextui-org/react"; } from "@heroui/react";
import { getTasks, Task } from "@/lib"; import { getTasks, Task } from "@/lib";
import { EventData } from "@/Zustand"; import { EventData } from "@/Zustand";

2
client/src/components/Event/Event.tsx
View File

@@ -2,7 +2,7 @@
import LocalDate from "../LocalDate"; import LocalDate from "../LocalDate";
import { EventData } from "@/Zustand"; import { EventData } from "@/Zustand";
import { Card, CardBody, CardHeader, Divider } from "@nextui-org/react"; import { Card, CardBody, CardHeader, Divider } from "@heroui/react";
import React from "react"; import React from "react";
export default function Event({ export default function Event({

12
client/tailwind.config.ts
View File

@@ -1,5 +1,5 @@
import type { Config } from "tailwindcss"; import type { Config } from "tailwindcss";
import { nextui } from "@nextui-org/theme"; import { heroui } from "@heroui/theme";
const HIGHLIGHT = "hsl(359,100%,65.7%)"; // #ff5053 const HIGHLIGHT = "hsl(359,100%,65.7%)"; // #ff5053
const FOREGROUND = "hsl(295,100%,97.5%)"; // #fef2ff const FOREGROUND = "hsl(295,100%,97.5%)"; // #fef2ff
@@ -15,7 +15,7 @@ export default {
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}", "./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
"./src/components/**/*.{js,ts,jsx,tsx,mdx}", "./src/components/**/*.{js,ts,jsx,tsx,mdx}",
"./src/app/**/*.{js,ts,jsx,tsx,mdx}", "./src/app/**/*.{js,ts,jsx,tsx,mdx}",
"./node_modules/@nextui-org/theme/dist/**/*.{js,ts,jsx,tsx}", "./node_modules/@heroui/theme/dist/**/*.{js,ts,jsx,tsx}",
], ],
theme: { theme: {
extend: { extend: {
@@ -54,9 +54,15 @@ export default {
numbers: ["space-mono"], numbers: ["space-mono"],
}, },
}, },
safelist: [
{
pattern:
/(text|bg)-(red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)-600/,
},
],
darkMode: "class", darkMode: "class",
plugins: [ plugins: [
nextui({ heroui({
defaultTheme: "dark", defaultTheme: "dark",
defaultExtendTheme: "dark", defaultExtendTheme: "dark",
themes: { themes: {