feat: Basic Calendar without any functions

This commit is contained in:
Semir 2025-05-15 08:40:12 +02:00 committed by Dominik Stahl
parent f240bf525d
commit a3bfeb4e82
Signed by: dominik
GPG key ID: 06A4003FC5049644
3 changed files with 220 additions and 50 deletions

View file

@ -44,7 +44,8 @@
"next": "15.4.0-canary.91",
"next-auth": "^5.0.0-beta.25",
"next-themes": "^0.4.6",
"react": "^19.0.0",
"react": "^19.1.0",
"react-calendar": "^5.1.0",
"react-dom": "^19.0.0",
"react-hook-form": "^7.56.4",
"swagger-ui-react": "^5.24.1",

View file

@ -1,23 +1,114 @@
'use client';
import React from 'react';
import { RedirectButton } from '@/components/buttons/redirect-button';
import { ThemePicker } from '@/components/misc/theme-picker';
import { useGetApiUserMe } from '@/generated/api/user/user';
const Calendar: React.FC = () => {
const today = new Date();
const currentYear = today.getFullYear();
const currentMonth = today.getMonth();
const currentDate = today.getDate();
export default function Home() {
const { data, isLoading } = useGetApiUserMe();
const firstDayMonth = new Date(currentYear, currentMonth, 1);
const lastDayMonth = new Date(currentYear, currentMonth + 1, 0);
const startDay = (firstDayMonth.getDay() + 6) % 7;
const daysMonth = lastDayMonth.getDate();
const weeks: (number | null)[][] = [];
let currentDay = 1;
const firstWeek: (number | null)[] = [];
for (let i = 0; i < 7; i++) {
if (i < startDay) {
firstWeek.push(null);
} else {
firstWeek.push(currentDay);
currentDay++;
}
}
weeks.push(firstWeek);
while (currentDay <= daysMonth) {
const week: (number | null)[] = [];
for (let i = 0; i < 7; i++) {
if (currentDay <= daysMonth) {
week.push(currentDay);
currentDay++;
} else {
week.push(null);
}
}
weeks.push(week);
}
const weekdays = ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday'];
return (
<div className='flex flex-col items-center justify-center h-screen'>
<div className='absolute top-4 right-4'>{<ThemePicker />}</div>
<div>
<h1>
Hello{' '}
{isLoading ? 'Loading...' : data?.data.user?.name || 'Unknown User'}
</h1>
<RedirectButton redirectUrl='/logout' buttonText='Logout' />
<RedirectButton redirectUrl='/settings' buttonText='Settings' />
</div>
<div style={{
maxWidth: '1000px',
margin: '0 auto',
fontFamily: 'Arial, sans-serif'
}}>
<h1 style={{
textAlign: 'center'
}}>
{new Date(currentYear, currentMonth).toLocaleString('en-EN', {
month: 'long',
year: 'numeric'
})}
</h1>
<table style={{
width: '100%',
borderCollapse: 'collapse'
}} border={1}>
<thead>
<tr>
{weekdays.map((day, index) => (
<th
key={index}
style={{
padding: '10px',
backgroundColor: '#f0f0f0',
border: '1px solid #ddd'
}}>
{day}
</th>
))}
</tr>
</thead>
<tbody>
{weeks.map((week, weekIndex) => (
<tr key={weekIndex}>
{week.map((day, dayIndex) => (
<td
key={dayIndex}
style={{
border: '1px solid #ddd',
position: 'relative',
minWidth: '120px',
minHeight: '100px',
padding: '50px',
verticalAlign: 'top',
backgroundColor: day === currentDate ? '#add8e6' : 'transparent'
}}
>
{day && (
<div
style={{
position: 'absolute',
top: '5px',
left: '5px',
fontWeight: 'bold'
}}
>
{day}
</div>
)}
</td>
))}
</tr>
))}
</tbody>
</table>
</div>
);
}
};
export default Calendar;

142
yarn.lock
View file

@ -543,15 +543,15 @@ __metadata:
linkType: hard
"@gerrit0/mini-shiki@npm:^3.2.2":
version: 3.6.0
resolution: "@gerrit0/mini-shiki@npm:3.6.0"
version: 3.7.0
resolution: "@gerrit0/mini-shiki@npm:3.7.0"
dependencies:
"@shikijs/engine-oniguruma": "npm:^3.6.0"
"@shikijs/langs": "npm:^3.6.0"
"@shikijs/themes": "npm:^3.6.0"
"@shikijs/types": "npm:^3.6.0"
"@shikijs/engine-oniguruma": "npm:^3.7.0"
"@shikijs/langs": "npm:^3.7.0"
"@shikijs/themes": "npm:^3.7.0"
"@shikijs/types": "npm:^3.7.0"
"@shikijs/vscode-textmate": "npm:^10.0.2"
checksum: 10c0/347456c9da8a1fadd3c1f63097da459a5f930ef4bca6431cce913a379012c551e061d0a94ff7a0f307215b87f2418b7c198a55fba888fc97fb02ab36247adf6b
checksum: 10c0/eb3f4900d841338077d839ebbc7f8722b13876a586cff7abc73295e956683724dd3371a9f990900184a2d069461965951b2604d677991badf3474262e7811384
languageName: node
linkType: hard
@ -1966,7 +1966,7 @@ __metadata:
languageName: node
linkType: hard
"@shikijs/engine-oniguruma@npm:^3.6.0":
"@shikijs/engine-oniguruma@npm:^3.7.0":
version: 3.7.0
resolution: "@shikijs/engine-oniguruma@npm:3.7.0"
dependencies:
@ -1976,7 +1976,7 @@ __metadata:
languageName: node
linkType: hard
"@shikijs/langs@npm:^3.6.0":
"@shikijs/langs@npm:^3.7.0":
version: 3.7.0
resolution: "@shikijs/langs@npm:3.7.0"
dependencies:
@ -1985,7 +1985,7 @@ __metadata:
languageName: node
linkType: hard
"@shikijs/themes@npm:^3.6.0":
"@shikijs/themes@npm:^3.7.0":
version: 3.7.0
resolution: "@shikijs/themes@npm:3.7.0"
dependencies:
@ -1994,7 +1994,7 @@ __metadata:
languageName: node
linkType: hard
"@shikijs/types@npm:3.7.0, @shikijs/types@npm:^3.6.0":
"@shikijs/types@npm:3.7.0, @shikijs/types@npm:^3.7.0":
version: 3.7.0
resolution: "@shikijs/types@npm:3.7.0"
dependencies:
@ -3460,6 +3460,13 @@ __metadata:
languageName: node
linkType: hard
"@wojtekmaj/date-utils@npm:^1.1.3":
version: 1.5.1
resolution: "@wojtekmaj/date-utils@npm:1.5.1"
checksum: 10c0/7c213cca5ab6b84ef61b9aea2b9fb8a04bf4c9764b28a97ffc4ee46a3e81560532a74d106a6f8aeef4792e1aaa6ea3dfd3c4a639dddbea560eb3f33cd62b8d7d
languageName: node
linkType: hard
"abbrev@npm:^3.0.0":
version: 3.0.1
resolution: "abbrev@npm:3.0.1"
@ -3662,7 +3669,7 @@ __metadata:
languageName: node
linkType: hard
"array-includes@npm:^3.1.6, array-includes@npm:^3.1.8":
"array-includes@npm:^3.1.6, array-includes@npm:^3.1.8, array-includes@npm:^3.1.9":
version: 3.1.9
resolution: "array-includes@npm:3.1.9"
dependencies:
@ -3699,7 +3706,7 @@ __metadata:
languageName: node
linkType: hard
"array.prototype.findlastindex@npm:^1.2.5":
"array.prototype.findlastindex@npm:^1.2.6":
version: 1.2.6
resolution: "array.prototype.findlastindex@npm:1.2.6"
dependencies:
@ -3714,7 +3721,7 @@ __metadata:
languageName: node
linkType: hard
"array.prototype.flat@npm:^1.3.1, array.prototype.flat@npm:^1.3.2":
"array.prototype.flat@npm:^1.3.1, array.prototype.flat@npm:^1.3.3":
version: 1.3.3
resolution: "array.prototype.flat@npm:1.3.3"
dependencies:
@ -4051,7 +4058,7 @@ __metadata:
languageName: node
linkType: hard
"clsx@npm:^2.1.1":
"clsx@npm:^2.0.0, clsx@npm:^2.1.1":
version: 2.1.1
resolution: "clsx@npm:2.1.1"
checksum: 10c0/c4c8eb865f8c82baab07e71bfa8897c73454881c4f99d6bc81585aecd7c441746c1399d08363dc096c550cceaf97bd4ce1e8854e1771e9998d9f94c4fe075839
@ -4792,7 +4799,7 @@ __metadata:
languageName: node
linkType: hard
"eslint-module-utils@npm:^2.12.0":
"eslint-module-utils@npm:^2.12.1":
version: 2.12.1
resolution: "eslint-module-utils@npm:2.12.1"
dependencies:
@ -4805,31 +4812,31 @@ __metadata:
linkType: hard
"eslint-plugin-import@npm:^2.31.0":
version: 2.31.0
resolution: "eslint-plugin-import@npm:2.31.0"
version: 2.32.0
resolution: "eslint-plugin-import@npm:2.32.0"
dependencies:
"@rtsao/scc": "npm:^1.1.0"
array-includes: "npm:^3.1.8"
array.prototype.findlastindex: "npm:^1.2.5"
array.prototype.flat: "npm:^1.3.2"
array.prototype.flatmap: "npm:^1.3.2"
array-includes: "npm:^3.1.9"
array.prototype.findlastindex: "npm:^1.2.6"
array.prototype.flat: "npm:^1.3.3"
array.prototype.flatmap: "npm:^1.3.3"
debug: "npm:^3.2.7"
doctrine: "npm:^2.1.0"
eslint-import-resolver-node: "npm:^0.3.9"
eslint-module-utils: "npm:^2.12.0"
eslint-module-utils: "npm:^2.12.1"
hasown: "npm:^2.0.2"
is-core-module: "npm:^2.15.1"
is-core-module: "npm:^2.16.1"
is-glob: "npm:^4.0.3"
minimatch: "npm:^3.1.2"
object.fromentries: "npm:^2.0.8"
object.groupby: "npm:^1.0.3"
object.values: "npm:^1.2.0"
object.values: "npm:^1.2.1"
semver: "npm:^6.3.1"
string.prototype.trimend: "npm:^1.0.8"
string.prototype.trimend: "npm:^1.0.9"
tsconfig-paths: "npm:^3.15.0"
peerDependencies:
eslint: ^2 || ^3 || ^4 || ^5 || ^6 || ^7.2.0 || ^8 || ^9
checksum: 10c0/e21d116ddd1900e091ad120b3eb68c5dd5437fe2c930f1211781cd38b246f090a6b74d5f3800b8255a0ed29782591521ad44eb21c5534960a8f1fb4040fd913a
checksum: 10c0/bfb1b8fc8800398e62ddfefbf3638d185286edfed26dfe00875cc2846d954491b4f5112457831588b757fa789384e1ae585f812614c4797f0499fa234fd4a48b
languageName: node
linkType: hard
@ -5359,6 +5366,15 @@ __metadata:
languageName: node
linkType: hard
"get-user-locale@npm:^2.2.1":
version: 2.3.2
resolution: "get-user-locale@npm:2.3.2"
dependencies:
mem: "npm:^8.0.0"
checksum: 10c0/2796b3fc3782b1f4826f31e899642cf72eeb23e296e1cf55280aab5caf7a25f4b906491ee1508a001519d6a410902ccf8fa8edaa895b7aee5dfd422ffe5523b9
languageName: node
linkType: hard
"glob-parent@npm:^5.1.2":
version: 5.1.2
resolution: "glob-parent@npm:5.1.2"
@ -5758,7 +5774,7 @@ __metadata:
languageName: node
linkType: hard
"is-core-module@npm:^2.13.0, is-core-module@npm:^2.15.1, is-core-module@npm:^2.16.0":
"is-core-module@npm:^2.13.0, is-core-module@npm:^2.16.0, is-core-module@npm:^2.16.1":
version: 2.16.1
resolution: "is-core-module@npm:2.16.1"
dependencies:
@ -6505,6 +6521,15 @@ __metadata:
languageName: node
linkType: hard
"map-age-cleaner@npm:^0.1.3":
version: 0.1.3
resolution: "map-age-cleaner@npm:0.1.3"
dependencies:
p-defer: "npm:^1.0.0"
checksum: 10c0/7495236c7b0950956c144fd8b4bc6399d4e78072a8840a4232fe1c4faccbb5eb5d842e5c0a56a60afc36d723f315c1c672325ca03c1b328650f7fcc478f385fd
languageName: node
linkType: hard
"markdown-it@npm:^14.1.0":
version: 14.1.0
resolution: "markdown-it@npm:14.1.0"
@ -6580,7 +6605,8 @@ __metadata:
postcss: "npm:8.5.6"
prettier: "npm:3.5.3"
prisma: "npm:6.10.1"
react: "npm:^19.0.0"
react: "npm:^19.1.0"
react-calendar: "npm:^5.1.0"
react-dom: "npm:^19.0.0"
react-hook-form: "npm:^7.56.4"
swagger-ui-react: "npm:^5.24.1"
@ -6594,6 +6620,16 @@ __metadata:
languageName: unknown
linkType: soft
"mem@npm:^8.0.0":
version: 8.1.1
resolution: "mem@npm:8.1.1"
dependencies:
map-age-cleaner: "npm:^0.1.3"
mimic-fn: "npm:^3.1.0"
checksum: 10c0/5829c404d024c1accaf76ebacbc7eae9b59e5ce5722d184aa24e8387a8097a499f6aa7e181021003c51eb87b2dcdc9a2270050c58753cce761de206643cba91c
languageName: node
linkType: hard
"merge-stream@npm:^2.0.0":
version: 2.0.0
resolution: "merge-stream@npm:2.0.0"
@ -6641,6 +6677,13 @@ __metadata:
languageName: node
linkType: hard
"mimic-fn@npm:^3.1.0":
version: 3.1.0
resolution: "mimic-fn@npm:3.1.0"
checksum: 10c0/a07cdd8ed6490c2dff5b11f889b245d9556b80f5a653a552a651d17cff5a2d156e632d235106c2369f00cccef4071704589574cf3601bc1b1400a1f620dff067
languageName: node
linkType: hard
"minim@npm:~0.23.8":
version: 0.23.8
resolution: "minim@npm:0.23.8"
@ -7185,7 +7228,7 @@ __metadata:
languageName: node
linkType: hard
"object.values@npm:^1.1.6, object.values@npm:^1.2.0, object.values@npm:^1.2.1":
"object.values@npm:^1.1.6, object.values@npm:^1.2.1":
version: 1.2.1
resolution: "object.values@npm:1.2.1"
dependencies:
@ -7303,6 +7346,13 @@ __metadata:
languageName: node
linkType: hard
"p-defer@npm:^1.0.0":
version: 1.0.0
resolution: "p-defer@npm:1.0.0"
checksum: 10c0/ed603c3790e74b061ac2cb07eb6e65802cf58dce0fbee646c113a7b71edb711101329ad38f99e462bd2e343a74f6e9366b496a35f1d766c187084d3109900487
languageName: node
linkType: hard
"p-limit@npm:^3.0.2":
version: 3.1.0
resolution: "p-limit@npm:3.1.0"
@ -7630,6 +7680,25 @@ __metadata:
languageName: node
linkType: hard
"react-calendar@npm:^5.1.0":
version: 5.1.0
resolution: "react-calendar@npm:5.1.0"
dependencies:
"@wojtekmaj/date-utils": "npm:^1.1.3"
clsx: "npm:^2.0.0"
get-user-locale: "npm:^2.2.1"
warning: "npm:^4.0.0"
peerDependencies:
"@types/react": ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
react-dom: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
peerDependenciesMeta:
"@types/react":
optional: true
checksum: 10c0/27673f639c5d6296342a2a888436b31a5d602faeaae01be83b2beb98ff568b0a3d1514f5cc50fcacf3ac50b9c0b9d2fb423b0c001a8f5f1a22816671409e2616
languageName: node
linkType: hard
"react-copy-to-clipboard@npm:5.1.0":
version: 5.1.0
resolution: "react-copy-to-clipboard@npm:5.1.0"
@ -7798,7 +7867,7 @@ __metadata:
languageName: node
linkType: hard
"react@npm:^19.0.0":
"react@npm:^19.1.0":
version: 19.1.0
resolution: "react@npm:19.1.0"
checksum: 10c0/530fb9a62237d54137a13d2cfb67a7db6a2156faed43eecc423f4713d9b20c6f2728b026b45e28fcd72e8eadb9e9ed4b089e99f5e295d2f0ad3134251bdd3698
@ -8569,7 +8638,7 @@ __metadata:
languageName: node
linkType: hard
"string.prototype.trimend@npm:^1.0.8, string.prototype.trimend@npm:^1.0.9":
"string.prototype.trimend@npm:^1.0.9":
version: 1.0.9
resolution: "string.prototype.trimend@npm:1.0.9"
dependencies:
@ -9324,6 +9393,15 @@ __metadata:
languageName: node
linkType: hard
"warning@npm:^4.0.0":
version: 4.0.3
resolution: "warning@npm:4.0.3"
dependencies:
loose-envify: "npm:^1.0.0"
checksum: 10c0/aebab445129f3e104c271f1637fa38e55eb25f968593e3825bd2f7a12bd58dc3738bb70dc8ec85826621d80b4acfed5a29ebc9da17397c6125864d72301b937e
languageName: node
linkType: hard
"web-streams-polyfill@npm:^3.0.3":
version: 3.3.3
resolution: "web-streams-polyfill@npm:3.3.3"