Skip to content

Commit 5ab43ab

Browse files
author
Tarash Agarwal
committed
Fixes
1 parent 8a57e54 commit 5ab43ab

File tree

3 files changed

+131
-108
lines changed

3 files changed

+131
-108
lines changed

src/ui/pages/siglead/ManageSigLeads.page.tsx

Lines changed: 64 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -8,37 +8,40 @@ import {
88
Button,
99
Loader,
1010
Container,
11-
} from '@mantine/core';
12-
import { DateTimePicker } from '@mantine/dates';
13-
import { useForm, zodResolver } from '@mantine/form';
14-
import { notifications } from '@mantine/notifications';
15-
import dayjs from 'dayjs';
16-
import React, { useEffect, useState } from 'react';
17-
import { useNavigate, useParams } from 'react-router-dom';
18-
import { z } from 'zod';
19-
import { AuthGuard } from '@ui/components/AuthGuard';
20-
import { getRunEnvironmentConfig } from '@ui/config';
21-
import { useApi } from '@ui/util/api';
22-
import { OrganizationList as orgList } from '@common/orgs';
23-
import { AppRoles } from '@common/roles';
24-
import { ScreenComponent } from './SigScreenComponents';
11+
} from "@mantine/core";
12+
import { DateTimePicker } from "@mantine/dates";
13+
import { useForm, zodResolver } from "@mantine/form";
14+
import { notifications } from "@mantine/notifications";
15+
import dayjs from "dayjs";
16+
import React, { useEffect, useState } from "react";
17+
import { useNavigate, useParams } from "react-router-dom";
18+
import { z } from "zod";
19+
import { AuthGuard } from "@ui/components/AuthGuard";
20+
import { getRunEnvironmentConfig } from "@ui/config";
21+
import { useApi } from "@ui/util/api";
22+
import { OrganizationList as orgList } from "@common/orgs";
23+
import { AppRoles } from "@common/roles";
24+
import { ScreenComponent } from "./SigScreenComponents";
2525

2626
export function capitalizeFirstLetter(string: string) {
2727
return string.charAt(0).toUpperCase() + string.slice(1);
2828
}
2929

30-
const repeatOptions = ['weekly', 'biweekly'] as const;
30+
const repeatOptions = ["weekly", "biweekly"] as const;
3131

3232
const baseBodySchema = z.object({
33-
title: z.string().min(1, 'Title is required'),
34-
description: z.string().min(1, 'Description is required'),
33+
title: z.string().min(1, "Title is required"),
34+
description: z.string().min(1, "Description is required"),
3535
start: z.date(),
3636
end: z.optional(z.date()),
37-
location: z.string().min(1, 'Location is required'),
38-
locationLink: z.optional(z.string().url('Invalid URL')),
39-
host: z.string().min(1, 'Host is required'),
37+
location: z.string().min(1, "Location is required"),
38+
locationLink: z.optional(z.string().url("Invalid URL")),
39+
host: z.string().min(1, "Host is required"),
4040
featured: z.boolean().default(false),
41-
paidEventId: z.string().min(1, 'Paid Event ID must be at least 1 character').optional(),
41+
paidEventId: z
42+
.string()
43+
.min(1, "Paid Event ID must be at least 1 character")
44+
.optional(),
4245
});
4346

4447
const requestBodySchema = baseBodySchema
@@ -47,23 +50,23 @@ const requestBodySchema = baseBodySchema
4750
repeatEnds: z.date().optional(),
4851
})
4952
.refine((data) => (data.repeatEnds ? data.repeats !== undefined : true), {
50-
message: 'Repeat frequency is required when Repeat End is specified.',
53+
message: "Repeat frequency is required when Repeat End is specified.",
5154
})
5255
.refine((data) => !data.end || data.end >= data.start, {
53-
message: 'Event end date cannot be earlier than the start date.',
54-
path: ['end'],
56+
message: "Event end date cannot be earlier than the start date.",
57+
path: ["end"],
5558
})
5659
.refine((data) => !data.repeatEnds || data.repeatEnds >= data.start, {
57-
message: 'Repeat end date cannot be earlier than the start date.',
58-
path: ['repeatEnds'],
60+
message: "Repeat end date cannot be earlier than the start date.",
61+
path: ["repeatEnds"],
5962
});
6063

6164
type EventPostRequest = z.infer<typeof requestBodySchema>;
6265

6366
export const ManageSigLeadsPage: React.FC = () => {
6467
const [isSubmitting, setIsSubmitting] = useState<boolean>(false);
6568
const navigate = useNavigate();
66-
const api = useApi('core');
69+
const api = useApi("core");
6770

6871
const { eventId } = useParams();
6972

@@ -88,14 +91,16 @@ export const ManageSigLeadsPage: React.FC = () => {
8891
host: eventData.host,
8992
featured: eventData.featured,
9093
repeats: eventData.repeats,
91-
repeatEnds: eventData.repeatEnds ? new Date(eventData.repeatEnds) : undefined,
94+
repeatEnds: eventData.repeatEnds
95+
? new Date(eventData.repeatEnds)
96+
: undefined,
9297
paidEventId: eventData.paidEventId,
9398
};
9499
form.setValues(formValues);
95100
} catch (error) {
96-
console.error('Error fetching event data:', error);
101+
console.error("Error fetching event data:", error);
97102
notifications.show({
98-
message: 'Failed to fetch event data, please try again.',
103+
message: "Failed to fetch event data, please try again.",
99104
});
100105
}
101106
};
@@ -105,13 +110,13 @@ export const ManageSigLeadsPage: React.FC = () => {
105110
const form = useForm<EventPostRequest>({
106111
validate: zodResolver(requestBodySchema),
107112
initialValues: {
108-
title: '',
109-
description: '',
113+
title: "",
114+
description: "",
110115
start: new Date(),
111116
end: new Date(new Date().valueOf() + 3.6e6), // 1 hr later
112-
location: 'ACM Room (Siebel CS 1104)',
113-
locationLink: 'https://maps.app.goo.gl/dwbBBBkfjkgj8gvA8',
114-
host: 'ACM',
117+
location: "ACM Room (Siebel CS 1104)",
118+
locationLink: "https://maps.app.goo.gl/dwbBBBkfjkgj8gvA8",
119+
host: "ACM",
115120
featured: false,
116121
repeats: undefined,
117122
repeatEnds: undefined,
@@ -121,15 +126,17 @@ export const ManageSigLeadsPage: React.FC = () => {
121126

122127
const checkPaidEventId = async (paidEventId: string) => {
123128
try {
124-
const merchEndpoint = getRunEnvironmentConfig().ServiceConfiguration.merch.baseEndpoint;
125-
const ticketEndpoint = getRunEnvironmentConfig().ServiceConfiguration.tickets.baseEndpoint;
126-
const paidEventHref = paidEventId.startsWith('merch:')
129+
const merchEndpoint =
130+
getRunEnvironmentConfig().ServiceConfiguration.merch.baseEndpoint;
131+
const ticketEndpoint =
132+
getRunEnvironmentConfig().ServiceConfiguration.tickets.baseEndpoint;
133+
const paidEventHref = paidEventId.startsWith("merch:")
127134
? `${merchEndpoint}/api/v1/merch/details?itemid=${paidEventId.slice(6)}`
128135
: `${ticketEndpoint}/api/v1/event/details?eventid=${paidEventId}`;
129136
const response = await api.get(paidEventHref);
130137
return Boolean(response.status < 299 && response.status >= 200);
131138
} catch (error) {
132-
console.error('Error validating paid event ID:', error);
139+
console.error("Error validating paid event ID:", error);
133140
return false;
134141
}
135142
};
@@ -139,33 +146,41 @@ export const ManageSigLeadsPage: React.FC = () => {
139146
setIsSubmitting(true);
140147
const realValues = {
141148
...values,
142-
start: dayjs(values.start).format('YYYY-MM-DD[T]HH:mm:00'),
143-
end: values.end ? dayjs(values.end).format('YYYY-MM-DD[T]HH:mm:00') : undefined,
149+
start: dayjs(values.start).format("YYYY-MM-DD[T]HH:mm:00"),
150+
end: values.end
151+
? dayjs(values.end).format("YYYY-MM-DD[T]HH:mm:00")
152+
: undefined,
144153
repeatEnds:
145154
values.repeatEnds && values.repeats
146-
? dayjs(values.repeatEnds).format('YYYY-MM-DD[T]HH:mm:00')
155+
? dayjs(values.repeatEnds).format("YYYY-MM-DD[T]HH:mm:00")
147156
: undefined,
148157
repeats: values.repeats ? values.repeats : undefined,
149158
};
150159

151-
const eventURL = isEditing ? `/api/v1/events/${eventId}` : '/api/v1/events';
160+
const eventURL = isEditing
161+
? `/api/v1/events/${eventId}`
162+
: "/api/v1/events";
152163
const response = await api.post(eventURL, realValues);
153164
notifications.show({
154-
title: isEditing ? 'Event updated!' : 'Event created!',
155-
message: isEditing ? undefined : `The event ID is "${response.data.id}".`,
165+
title: isEditing ? "Event updated!" : "Event created!",
166+
message: isEditing
167+
? undefined
168+
: `The event ID is "${response.data.id}".`,
156169
});
157-
navigate('/events/manage');
170+
navigate("/events/manage");
158171
} catch (error) {
159172
setIsSubmitting(false);
160-
console.error('Error creating/editing event:', error);
173+
console.error("Error creating/editing event:", error);
161174
notifications.show({
162-
message: 'Failed to create/edit event, please try again.',
175+
message: "Failed to create/edit event, please try again.",
163176
});
164177
}
165178
};
166179

167180
return (
168-
<AuthGuard resourceDef={{ service: 'core', validRoles: [AppRoles.IAM_ADMIN] }}>
181+
<AuthGuard
182+
resourceDef={{ service: "core", validRoles: [AppRoles.IAM_ADMIN] }}
183+
>
169184
<Container>
170185
<Title order={2}>SigLead Management System</Title>
171186
<ScreenComponent />

src/ui/pages/siglead/SigScreenComponents.tsx

Lines changed: 19 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,13 @@
1-
import React, { useEffect, useMemo, useState } from 'react';
2-
import { OrganizationList } from '@common/orgs';
3-
import { NavLink, Paper } from '@mantine/core';
4-
import { IconUsersGroup } from '@tabler/icons-react';
5-
import { useLocation } from 'react-router-dom';
1+
import React, { useEffect, useMemo, useState } from "react";
2+
import { OrganizationList } from "@common/orgs";
3+
import { NavLink, Paper } from "@mantine/core";
4+
import { IconUsersGroup } from "@tabler/icons-react";
5+
import { useLocation } from "react-router-dom";
66

77
const renderSigLink = (org: string, index: number) => {
8-
const color = 'light-dark(var(--mantine-color-black), var(--mantine-color-white))';
9-
const size = '18px';
8+
const color =
9+
"light-dark(var(--mantine-color-black), var(--mantine-color-white))";
10+
const size = "18px";
1011
return (
1112
<NavLink
1213
href={`${useLocation().pathname}/${org}`}
@@ -17,9 +18,9 @@ const renderSigLink = (org: string, index: number) => {
1718
rightSection={
1819
<div
1920
style={{
20-
display: 'flex',
21-
alignItems: 'center',
22-
gap: '4px',
21+
display: "flex",
22+
alignItems: "center",
23+
gap: "4px",
2324
color: `${color}`,
2425
fontSize: `${size}`,
2526
}}
@@ -45,14 +46,14 @@ export const ScreenComponent: React.FC = () => {
4546
shadow="xs"
4647
p="sm"
4748
style={{
48-
display: 'flex',
49-
justifyContent: 'space-between',
50-
alignItems: 'center',
51-
fontWeight: 'bold',
52-
borderRadius: '8px',
53-
padding: '10px 16px',
54-
marginBottom: '8px',
55-
fontSize: '22px',
49+
display: "flex",
50+
justifyContent: "space-between",
51+
alignItems: "center",
52+
fontWeight: "bold",
53+
borderRadius: "8px",
54+
padding: "10px 16px",
55+
marginBottom: "8px",
56+
fontSize: "22px",
5657
}}
5758
>
5859
<span>Organization</span>

0 commit comments

Comments
 (0)