|
1 | | -import { Routes, Route, useNavigate } from "react-router-dom"; |
2 | | -import { useDebouncedCallback } from "use-debounce"; |
3 | | -import { match } from "ts-pattern"; |
4 | | -import { |
5 | | - LoadingSpinner, |
6 | | - useDeskproElements, |
7 | | - useDeskproAppClient, |
8 | | - useDeskproAppEvents, |
9 | | -} from "@deskpro/app-sdk"; |
10 | | -import { useLogout, useUnlinkIssue } from "./hooks"; |
11 | | -import { |
12 | | - isUnlinkPayload, |
13 | | - isNavigatePayload, |
14 | | -} from "./utils"; |
15 | | -import { |
16 | | - HomePage, |
17 | | - LoginPage, |
18 | | - ViewIssuePage, |
19 | | - EditIssuePage, |
20 | | - LinkIssuesPage, |
21 | | - LoadingAppPage, |
22 | | - CreateIssuePage, |
23 | | - AdminCallbackPage, |
24 | | - CreateIssueCommentPage, |
25 | | -} from "./pages"; |
26 | | -import type { FC } from "react"; |
27 | | -import type { EventPayload } from "./types"; |
28 | | - |
29 | | -const App: FC = () => { |
30 | | - const navigate = useNavigate(); |
31 | | - const { client } = useDeskproAppClient(); |
32 | | - const { logout, isLoading: isLoadingLogout } = useLogout(); |
33 | | - const { unlink, isLoading: isLoadingUnlink } = useUnlinkIssue(); |
34 | | - const isLoading = [isLoadingLogout, isLoadingUnlink].some((isLoading) => isLoading); |
35 | | - |
36 | | - useDeskproElements(({ registerElement }) => { |
37 | | - registerElement("refresh", { type: "refresh_button" }); |
38 | | - }); |
39 | | - |
40 | | - const debounceElementEvent = useDebouncedCallback((_, __, payload: EventPayload) => { |
41 | | - return match(payload.type) |
42 | | - .with("changePage", () => isNavigatePayload(payload) && navigate(payload.path)) |
43 | | - .with("logout", logout) |
44 | | - .with("unlink", () => isUnlinkPayload(payload) && unlink(payload.issue)) |
45 | | - .run(); |
46 | | - }, 500); |
47 | | - |
48 | | - useDeskproAppEvents({ |
49 | | - onShow: () => { |
50 | | - client && setTimeout(() => client.resize(), 200); |
51 | | - }, |
52 | | - // eslint-disable-next-line @typescript-eslint/ban-ts-comment |
53 | | - // @ts-ignore |
54 | | - onElementEvent: debounceElementEvent, |
55 | | - }, [client]); |
56 | | - |
57 | | - if (!client || isLoading) { |
58 | | - return ( |
59 | | - <LoadingSpinner /> |
60 | | - ); |
61 | | - } |
| 1 | +import DeprecationNotice from "./components/DeprecationNotice"; |
62 | 2 |
|
| 3 | +export function App(){ |
63 | 4 | return ( |
64 | | - <Routes> |
65 | | - <Route path="/admin/callback" element={<AdminCallbackPage />} /> |
66 | | - <Route path="/login" element={<LoginPage />} /> |
67 | | - <Route path="/home" element={<HomePage />} /> |
68 | | - <Route path="/issues/link" element={<LinkIssuesPage />} /> |
69 | | - <Route path="/issues/view/:issueId" element={<ViewIssuePage />} /> |
70 | | - <Route path="/issues/create" element={<CreateIssuePage />} /> |
71 | | - <Route path="/issues/edit/:issueId" element={<EditIssuePage />} /> |
72 | | - <Route path="/issues/:issueId/comments/new" element={<CreateIssueCommentPage />} /> |
73 | | - <Route index element={<LoadingAppPage />} /> |
74 | | - </Routes> |
| 5 | + <DeprecationNotice/> |
75 | 6 | ); |
76 | 7 | }; |
77 | 8 |
|
78 | | -export { App }; |
0 commit comments