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

added adding and editing of availabilities

Browse Source
This commit is contained in:
z1glr
2025-01-18 13:25:12 +00:00
parent e37310b774
commit e17c9db90c
24 changed files with 737 additions and 163 deletions
Download Patch File Download Diff File Expand all files Collapse all files

61
client/src/components/Colorselector.tsx
View File

@@ -5,34 +5,49 @@ import {
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" },
];
export 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" },
];
export function color2Tailwind(v: string): string | undefined {
const find = colors.find((c) => c.value === v)?.tailwind;
return find;
}
export default function ColorSelector(props: {
name?: string;
value?: string;
onValueChange?: (value: string) => void;
}) {
return (
<RadioGroup classNames={{ wrapper: "grid grid-cols-4" }}>
<RadioGroup
value={props.value}
onValueChange={props.onValueChange}
classNames={{ wrapper: "grid grid-cols-4" }}
name={props.name}
>
{colors.map((color) => (
<ColorRadio
description={color.value}
value={color.value}
key={color.value}
radioColor={`bg-${color.tailwind}`}
radiocolor={`bg-${color.tailwind}`}
>
<div>{color.value}</div>
</ColorRadio>
@@ -41,13 +56,13 @@ export default function ColorSelector() {
);
}
function ColorRadio(props: { radioColor: string } & RadioProps) {
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`}
className={`aspect-square cursor-pointer rounded-lg border-2 border-default text-foreground transition tap-highlight-transparent hover:opacity-70 active:opacity-50 data-[selected=true]:border-2 data-[selected=true]:border-stone-300 ${props.radiocolor} flex select-none items-center justify-center p-1 text-sm`}
>
<VisuallyHidden>
<input {...getInputProps()} />

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

@@ -183,7 +183,7 @@ export default function EditEvent(props: {
>
{tasksMap !== undefined ? (
Object.entries(tasksMap)
.filter(([, task]) => !task.disabled)
.filter(([, task]) => task.enabled)
.map(([id, task]) => (
<div key={id}>
<Checkbox value={id}>{task.text}</Checkbox>