because I got bored of customising my CV for every job
refactor(client): update utilities and configuration
+68
-47
+4
-1
apps/client/src/index.css
+4
-1
apps/client/src/index.css
+17
-4
apps/client/src/main.tsx
+17
-4
apps/client/src/main.tsx
···
1
-
import { ApolloProvider } from "@apollo/client";
1
+
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
2
+
import { ReactQueryDevtools } from "@tanstack/react-query-devtools";
2
3
import React from "react";
3
4
import { createRoot } from "react-dom/client";
4
5
import App from "./App";
5
6
import { ConfirmationModalProvider } from "./contexts/ConfirmationModalContext";
6
7
import { ToastProvider } from "./contexts/ToastContext";
7
8
import { TokenProvider } from "./contexts/TokenProvider";
8
-
import { apolloClient } from "./lib/apollo-client";
9
9
import "./index.css";
10
10
11
+
// Create a client
12
+
const queryClient = new QueryClient({
13
+
defaultOptions: {
14
+
queries: {
15
+
staleTime: 1000 * 60 * 5, // 5 minutes
16
+
gcTime: 1000 * 60 * 10, // 10 minutes (formerly cacheTime)
17
+
refetchOnWindowFocus: false,
18
+
retry: 1,
19
+
},
20
+
},
21
+
});
22
+
11
23
const container = document.getElementById("app");
12
24
13
25
if (container) {
14
26
const root = createRoot(container);
15
27
root.render(
16
28
<React.StrictMode>
17
-
<ApolloProvider client={apolloClient}>
29
+
<QueryClientProvider client={queryClient}>
18
30
<TokenProvider>
19
31
<ToastProvider>
20
32
<ConfirmationModalProvider>
···
22
34
</ConfirmationModalProvider>
23
35
</ToastProvider>
24
36
</TokenProvider>
25
-
</ApolloProvider>
37
+
<ReactQueryDevtools initialIsOpen={false} />
38
+
</QueryClientProvider>
26
39
</React.StrictMode>,
27
40
);
28
41
}
+4
-4
apps/client/src/types/graphql.d.ts
+4
-4
apps/client/src/types/graphql.d.ts
···
1
1
declare module "*.graphql" {
2
-
const content: string;
3
-
export default content;
2
+
const content: string;
3
+
export default content;
4
4
}
5
5
6
6
declare module "*.gql" {
7
-
const content: string;
8
-
export default content;
7
+
const content: string;
8
+
export default content;
9
9
}
+43
-38
apps/client/src/utils/dateUtils.ts
+43
-38
apps/client/src/utils/dateUtils.ts
···
3
3
*/
4
4
5
5
/**
6
-
* Formats a date string to a human-readable format
6
+
* Formats a date string to a readable format
7
7
* @param dateString - ISO date string
8
-
* @returns Formatted date string (e.g., "January 2023")
8
+
* @returns Formatted date string (e.g., "Jan 2023")
9
9
*/
10
-
export function formatDate(dateString: string): string {
10
+
export const formatDate = (dateString: string): string => {
11
11
return new Date(dateString).toLocaleDateString("en-US", {
12
12
year: "numeric",
13
-
month: "long",
13
+
month: "short",
14
14
});
15
-
}
15
+
};
16
+
17
+
/**
18
+
* Formats a date range for display
19
+
* @param startDate - Start date string
20
+
* @param endDate - End date string (optional, null for ongoing)
21
+
* @returns Formatted date range string (e.g., "Jan 2023 - Present" or "Jan 2023 - Mar 2024")
22
+
*/
23
+
export const formatDateRange = (
24
+
startDate: string,
25
+
endDate?: string | null,
26
+
): string => {
27
+
const start = formatDate(startDate);
28
+
const end = endDate ? formatDate(endDate) : "Present";
29
+
return `${start} - ${end}`;
30
+
};
16
31
17
32
/**
18
33
* Calculates the duration between two dates in years and months
···
20
35
* @param endDate - End date string (optional, defaults to current date)
21
36
* @returns Formatted duration string (e.g., "2y 3m" or "6m")
22
37
*/
23
-
export function calculateDuration(startDate: string, endDate?: string): string {
38
+
export const calculateDuration = (
39
+
startDate: string,
40
+
endDate?: string | null,
41
+
): string => {
24
42
const start = new Date(startDate);
25
43
const end = endDate ? new Date(endDate) : new Date();
26
44
const diffTime = Math.abs(end.getTime() - start.getTime());
···
32
50
return `${years}y ${months}m`;
33
51
}
34
52
return `${months}m`;
35
-
}
53
+
};
36
54
37
55
/**
38
-
* Formats a date range for display
39
-
* @param startDate - Start date string
40
-
* @param endDate - End date string (optional)
41
-
* @returns Formatted date range string (e.g., "January 2023 - Present" or "January 2023 - March 2024")
56
+
* Formats a deadline date, handling null/undefined gracefully
57
+
* @param deadlineString - ISO date string or null/undefined
58
+
* @returns Formatted date string (e.g., "Jan 15, 2024") or "—" if null/undefined
42
59
*/
43
-
export function formatDateRange(startDate: string, endDate?: string): string {
44
-
const formattedStart = formatDate(startDate);
45
-
const formattedEnd = endDate ? formatDate(endDate) : "Present";
46
-
return `${formattedStart} - ${formattedEnd}`;
47
-
}
60
+
export const formatDeadline = (deadlineString?: string | null): string => {
61
+
if (!deadlineString) {
62
+
return "—";
63
+
}
64
+
return new Date(deadlineString).toLocaleDateString("en-US", {
65
+
year: "numeric",
66
+
month: "short",
67
+
day: "numeric",
68
+
});
69
+
};
48
70
49
71
/**
50
72
* Format time difference in human readable format
51
73
* @param lastChecked - Date object or null
52
74
* @returns Formatted time difference string (e.g., "30s ago" or "2m ago")
53
75
*/
54
-
export function formatLastChecked(lastChecked: Date | null): string {
55
-
if (!lastChecked) return "";
76
+
export const formatLastChecked = (lastChecked: Date | null): string => {
77
+
if (!lastChecked) {
78
+
return "";
79
+
}
56
80
57
81
const now = new Date();
58
82
const diffMs = now.getTime() - lastChecked.getTime();
···
61
85
return diffSeconds < 60
62
86
? `${diffSeconds}s ago`
63
87
: `${Math.floor(diffSeconds / 60)}m ago`;
64
-
}
65
-
66
-
/**
67
-
* Formats a date string to a simple date format
68
-
* @param dateString - ISO date string
69
-
* @returns Formatted date string (e.g., "12/25/2023")
70
-
*/
71
-
export function formatSimpleDate(dateString: string): string {
72
-
return new Date(dateString).toLocaleDateString();
73
-
}
74
-
75
-
/**
76
-
* Formats a date string for deadline display, handling null/undefined
77
-
* @param deadlineString - ISO date string or null/undefined
78
-
* @returns Formatted date string or "—" if null/undefined
79
-
*/
80
-
export function formatDeadline(deadlineString?: string | null): string {
81
-
if (!deadlineString) return "—";
82
-
return new Date(deadlineString).toLocaleDateString();
83
-
}
88
+
};