Skip to content

Commit bcfb454

Browse files
authored
FR: Change default view to week view (#325)
1 parent 9e78125 commit bcfb454

14 files changed

Lines changed: 240 additions & 176 deletions

File tree

frontend/app/(planner)/[planner]/planner.tsx

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,8 @@ import {
4949
PopoverTrigger,
5050
} from "@/components/ui/popover";
5151
import { toast } from "sonner";
52-
import {useUser} from "@/components/provider/user-provider";
52+
import { useUser } from "@/components/provider/user-provider";
53+
import { useUI } from "@/components/provider/ui-provider";
5354

5455
interface PlannerPageProps {
5556
umbrellaID: number;
@@ -62,6 +63,7 @@ export function PlannerPage({ umbrellaID }: PlannerPageProps) {
6263

6364
const { user } = useUser();
6465
const { refetchKey } = useRefetch();
66+
const { isMobile } = useUI();
6567

6668
const [socials, setSocials] = useState<Setting[] | undefined>(undefined);
6769
const [events, setEvents] = useState<Event[]>([]);
@@ -353,7 +355,12 @@ export function PlannerPage({ umbrellaID }: PlannerPageProps) {
353355
)}
354356

355357
<section className="mt-5">
356-
<EventCalendar events={events} initialView={"agenda"} />
358+
{isMobile !== undefined && (
359+
<EventCalendar
360+
events={events}
361+
initialView={isMobile ? "day" : "week"}
362+
/>
363+
)}
357364
</section>
358365
</TooltipProvider>
359366
);

frontend/app/(planner)/[planner]/register/register-form.tsx

Lines changed: 132 additions & 107 deletions
Large diffs are not rendered by default.

frontend/app/(settings)/admin/locations/room-form.tsx

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -55,7 +55,6 @@ export default function RoomForm({room, currentBuilding, closeDialog, refreshTab
5555

5656
async function onValidSubmit(roomData: z.infer<typeof roomFormSchema>) {
5757
const client = getClient(String(sid));
58-
console.log(roomData)
5958

6059
if(createMode) {
6160
await client.request<AddRoomMutation>(AddRoomDocument, {room: roomData})

frontend/app/(settings)/profile/tutorials/[tutorial]/tutorial-page.tsx

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@ import { toast } from "sonner";
2828
import { Separator } from "@/components/ui/separator";
2929
import { RoomDetail } from "@/components/room-detail";
3030
import ConfirmationDialog from "@/components/confirmation-dialog";
31-
import {useUser} from "@/components/provider/user-provider";
31+
import { useUser } from "@/components/provider/user-provider";
3232

3333
interface TutorialPageProps {
3434
id: number;
@@ -59,7 +59,7 @@ export function TutorialPage({ id }: TutorialPageProps) {
5959

6060
const client = getClient(sid!);
6161

62-
if(!user) return;
62+
if (!user) return;
6363

6464
const vars: TutorialDetailQueryVariables = {
6565
tutorID: user.ID,
@@ -85,9 +85,8 @@ export function TutorialPage({ id }: TutorialPageProps) {
8585
}))
8686
);
8787
setEvent({ ...defaultEvent, ...tutorialsData.events[0] });
88-
} catch (err) {
88+
} catch {
8989
toast.error("Beim Laden der Tutoriendaten ist ein Fehler aufgetreten.");
90-
console.log(err);
9190
}
9291

9392
setLoading(false);

frontend/app/layout.tsx

Lines changed: 45 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,19 @@
1-
import {Inter as FontSans} from "next/font/google";
1+
import { Inter as FontSans } from "next/font/google";
22
import localFont from "next/font/local";
33

44
import "./globals.css";
5-
import {Toaster} from "@/components/ui/sonner";
6-
import {cn} from "@/lib/utils";
7-
import {siteConfig} from "@/config/site";
8-
import {TailwindIndicator} from "@/components/tailwind-indicator";
9-
import {RefetchProvider,} from "@/components/provider/refetch-provider";
5+
import { Toaster } from "@/components/ui/sonner";
6+
import { cn } from "@/lib/utils";
7+
import { siteConfig } from "@/config/site";
8+
import { TailwindIndicator } from "@/components/tailwind-indicator";
9+
import { RefetchProvider } from "@/components/provider/refetch-provider";
1010
import Header from "@/components/header";
11-
import React, {Suspense} from "react";
12-
import {Metadata} from "next";
13-
import {UserProvider} from "@/components/provider/user-provider";
14-
import {ThemeProvider} from "@/components/provider/theme-provider";
15-
import {LabelsProvider} from "@/components/provider/labels-provider";
11+
import React, { Suspense } from "react";
12+
import { Metadata } from "next";
13+
import { UserProvider } from "@/components/provider/user-provider";
14+
import { ThemeProvider } from "@/components/provider/theme-provider";
15+
import { LabelsProvider } from "@/components/provider/labels-provider";
16+
import { UIProvider } from "@/components/provider/ui-provider";
1617

1718
const fontSans = FontSans({
1819
subsets: ["latin"],
@@ -47,37 +48,41 @@ interface RootLayoutProps {
4748
children: React.ReactNode;
4849
}
4950

50-
export default function RootLayout({children}: RootLayoutProps) {
51+
export default function RootLayout({ children }: RootLayoutProps) {
5152
return (
5253
<html lang="de" suppressHydrationWarning>
53-
<head><title>{siteConfig.name}</title></head>
54-
<body
55-
className={cn(
56-
"flex w-screen flex-col bg-background font-sans antialiased",
57-
fontSans.variable,
58-
fontHeading.variable
59-
)}
60-
>
61-
<ThemeProvider
62-
attribute="class"
63-
defaultTheme="system"
64-
enableSystem
65-
disableTransitionOnChange
66-
>
67-
<Suspense>
68-
<RefetchProvider>
69-
<LabelsProvider>
70-
<UserProvider>
71-
<Header/>
72-
{children}
73-
<Toaster richColors/>
74-
<TailwindIndicator/>
75-
</UserProvider>
76-
</LabelsProvider>
77-
</RefetchProvider>
78-
</Suspense>
79-
</ThemeProvider>
80-
</body>
54+
<head>
55+
<title>{siteConfig.name}</title>
56+
</head>
57+
<body
58+
className={cn(
59+
"flex w-screen flex-col bg-background font-sans antialiased",
60+
fontSans.variable,
61+
fontHeading.variable
62+
)}
63+
>
64+
<ThemeProvider
65+
attribute="class"
66+
defaultTheme="system"
67+
enableSystem
68+
disableTransitionOnChange
69+
>
70+
<Suspense>
71+
<UIProvider>
72+
<RefetchProvider>
73+
<LabelsProvider>
74+
<UserProvider>
75+
<Header />
76+
{children}
77+
<Toaster richColors />
78+
<TailwindIndicator />
79+
</UserProvider>
80+
</LabelsProvider>
81+
</RefetchProvider>
82+
</UIProvider>
83+
</Suspense>
84+
</ThemeProvider>
85+
</body>
8186
</html>
8287
);
8388
}

frontend/components/event-calendar/constants.ts

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -10,13 +10,11 @@ export const WeekCellsHeight = 72
1010
export const AgendaDaysToShow = 30
1111

1212
// Start and end hours for the week and day views
13-
export const StartHour = 0
13+
export const StartHour = 8
1414
export const EndHour = 24
1515

1616
// Default start and end times
1717
export const DefaultStartHour = 9 // 9 AM
1818
export const DefaultEndHour = 10 // 10 AM
1919

20-
export const WeekStartsOn = 2
21-
2220
export const TimeZone = "UTC"

frontend/components/event-calendar/event-calendar.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -117,7 +117,7 @@ export function EventCalendar({
117117

118118
const viewmode = getViewModeFromQuery(searchParams);
119119
if (viewmode) setView(viewmode as CalendarView);
120-
else setView("agenda");
120+
else setView(initialView);
121121

122122
setHasInitializedFromQuery(true);
123123
}, []);

frontend/components/event-calendar/event-item.tsx

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -99,8 +99,6 @@ export function EventItem({
9999
return displayEnd.diff(displayStart, "minutes").minutes
100100
}, [displayStart, displayEnd]);
101101

102-
console.log(durationMinutes)
103-
104102
const getEventTime = () => {
105103
// For short events (less than 45 minutes), only show start time
106104
if (durationMinutes < 45) {

frontend/components/event-calendar/week-view.tsx

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -204,7 +204,9 @@ export function WeekView({
204204
<div data-slot="week-view" className="flex h-full flex-col">
205205
<div className="bg-background/80 border-border/70 sticky top-[80px] z-30 grid grid-cols-8 border-b backdrop-blur-md">
206206
<div className="text-muted-foreground/70 py-2 text-center text-sm">
207-
<span className="max-[479px]:sr-only">{DateTime.now().setZone(TimeZone).toFormat("O")}</span>
207+
<span className="max-[479px]:sr-only">
208+
{DateTime.now().setZone(TimeZone).toFormat("O")}
209+
</span>
208210
</div>
209211
{days.map((day) => (
210212
<div
@@ -230,8 +232,10 @@ export function WeekView({
230232
</div>
231233
{days.map((day, dayIndex) => {
232234
const dayAllDayEvents = allDayEvents.filter((event) => {
233-
const eventStart = DateTime.fromISO(event.from).setZone(TimeZone)
234-
const eventEnd = DateTime.fromISO(event.to).setZone(TimeZone)
235+
const eventStart = DateTime.fromISO(event.from).setZone(
236+
TimeZone
237+
);
238+
const eventEnd = DateTime.fromISO(event.to).setZone(TimeZone);
235239
return (
236240
day.hasSame(eventStart, "day") ||
237241
(day > eventStart && day < eventEnd) ||
@@ -246,14 +250,19 @@ export function WeekView({
246250
data-today={day.hasSame(DateTime.local(), "day") || undefined}
247251
>
248252
{dayAllDayEvents.map((event) => {
249-
const eventStart = DateTime.fromISO(event.from).setZone(TimeZone)
250-
const eventEnd = DateTime.fromISO(event.to).setZone(TimeZone)
251-
const isFirstDay = day.hasSame(eventStart, "day")
252-
const isLastDay = day.hasSame(eventEnd, "day")
253+
const eventStart = DateTime.fromISO(event.from).setZone(
254+
TimeZone
255+
);
256+
const eventEnd = DateTime.fromISO(event.to).setZone(
257+
TimeZone
258+
);
259+
const isFirstDay = day.hasSame(eventStart, "day");
260+
const isLastDay = day.hasSame(eventEnd, "day");
253261

254262
// Check if this is the first day in the current week view
255263
const isFirstVisibleDay =
256-
dayIndex === 0 && eventStart.toMillis() < weekStart.toMillis();
264+
dayIndex === 0 &&
265+
eventStart.toMillis() < weekStart.toMillis();
257266
const shouldShowTitle = isFirstDay || isFirstVisibleDay;
258267

259268
return (
@@ -373,8 +382,8 @@ export function WeekView({
373382
)}
374383
onClick={() => {
375384
const startTime = day.setZone(TimeZone);
376-
startTime.set({hour: hourValue})
377-
startTime.set({minute: quarter * 15})
385+
startTime.set({ hour: hourValue });
386+
startTime.set({ minute: quarter * 15 });
378387
onEventCreateAction(startTime);
379388
}}
380389
/>
Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
"use client";
2+
3+
import { createContext, ReactNode, useContext } from "react";
4+
import { useIsMobile } from "@/hooks/use-mobile";
5+
6+
type UIContextType = {
7+
isMobile: boolean | undefined;
8+
};
9+
10+
const UIContext = createContext<UIContextType | undefined>(undefined);
11+
12+
export const UIProvider = ({ children }: { children: ReactNode }) => {
13+
const isMobile = useIsMobile();
14+
15+
return (
16+
<UIContext.Provider value={{ isMobile }}>{children}</UIContext.Provider>
17+
);
18+
};
19+
20+
export const useUI = (): UIContextType => {
21+
const context = useContext(UIContext);
22+
if (context === undefined) {
23+
throw new Error("useUI must be used within a UIProvider");
24+
}
25+
return context;
26+
};

0 commit comments

Comments
 (0)