Skip to content

Commit

Permalink
1321 move routing logic to its own file so that it is a child compone… (
Browse files Browse the repository at this point in the history
#1337)

* 1321 move routing logic to its own file so that it is a child component of the AppProvider component and will thus have access to the auth state

* 1321 add Redirect import to Router file

* Move Router component to top level app directory
  • Loading branch information
schroerbrian authored Apr 12, 2024
1 parent eee78f9 commit f03a01a
Show file tree
Hide file tree
Showing 3 changed files with 126 additions and 146 deletions.
152 changes: 6 additions & 146 deletions app/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import ReactGA_4 from "react-ga4";

import Intercom from "react-intercom";
import { Helmet } from "react-helmet-async";
import { Redirect, Route, Switch, useHistory } from "react-router-dom";
import { useHistory } from "react-router-dom";

import { GeoCoordinates, getLocation, whiteLabel, AppProvider } from "./utils";
import {
Expand All @@ -20,54 +20,19 @@ import {
UserWay,
} from "./components/ui";

import { Router } from "./Router";

import config from "./config";
import MetaImage from "./assets/img/sfsg-preview.png";

import { HomePage } from "./pages/HomePage";
import { AboutPage } from "./pages/AboutPage";
import { ListingDebugPage } from "./pages/debug/ListingDemoPage";
import { OrganizationListingPage } from "./pages/OrganizationListingPage";
import { PrivacyPolicyPage } from "./pages/legal/PrivacyPolicy";
import {
RedirectToOrganizations,
RedirectToOrganizationsEdit,
} from "./pages/LegacyRedirects";
import { ResourceGuides, ResourceGuide } from "./pages/ResourceGuides";
import { SearchResultsPage } from "./pages/SearchResultsPage/SearchResultsPage";
import { ServiceListingPage } from "./pages/ServiceListingPage";
import { ServicePdfPage } from "./pages/Pdf/ServicePdfPage";
import { IntimatePartnerViolencePdfPage } from "./pages/Pdf/IntimatePartnerViolencePdfPage";
import { TermsOfServicePage } from "./pages/legal/TermsOfService";
import { UcsfHomePage } from "./pages/UcsfHomePage/UcsfHomePage";
import { UcsfDiscoveryForm } from "./pages/UcsfDiscoveryForm/UcsfDiscoveryForm";
import OrganizationEditPage from "./pages/OrganizationEditPage";
import { EditBreakingNewsPage } from "./pages/EditBreakingNewsPage";
import { ServiceDiscoveryForm } from "./pages/ServiceDiscoveryForm";
import { ServiceDiscoveryResults } from "./pages/ServiceDiscoveryResults";
import { LoginPage } from "./pages/Auth/LoginPage";
import { SignUpPage } from "./pages/Auth/SignUpPage";
import { LogoutPage } from "./pages/Auth/LogoutPage";

import styles from "./App.module.scss";

const {
homePageComponent,
intercom,
showBanner,
showSearch,
siteUrl,
title,
userWay,
} = whiteLabel;
const { intercom, showBanner, showSearch, siteUrl, title, userWay } =
whiteLabel;
const outerContainerId = "outer-container";
const pageWrapId = "page-wrap";

export const App = () => {
const homePageDictionary = {
HomePage,
UcsfHomePage,
};

const history = useHistory();
const [hamburgerOpen, setHamburgerOpen] = useState(false);
const [popUpMessage, setPopUpMessage] = useState<PopupMessageProp>({
Expand Down Expand Up @@ -139,112 +104,7 @@ export const App = () => {
/>
{showBanner && <Banner />}
<div className="container">
<Switch>
<Route
exact
path="/"
component={homePageDictionary[homePageComponent]}
/>
<Route exact path="/about" component={AboutPage} />
<Route exact path="/demo/listing" component={ListingDebugPage} />
{/* NB: /organizations/new must be listed before /organizations/:id or else the /new
step will be interpreted as an ID and will thus break the OrganizationEditPage */}
<Route
exact
path="/organizations/new"
render={(props) => (
<OrganizationEditPage
{...props}
showPopUpMessage={setPopUpMessage}
/>
)}
/>
<Route
exact
path="/organizations/:id"
component={OrganizationListingPage}
/>
<Route
exact
path="/organizations/:id/edit"
render={(props) => (
<OrganizationEditPage
{...props}
showPopUpMessage={setPopUpMessage}
/>
)}
/>
<Route
exact
path="/privacy-policy"
component={PrivacyPolicyPage}
/>
<Route exact path="/resource-guides" component={ResourceGuides} />
<Route
exact
path="/resource-guides/:id"
component={ResourceGuide}
/>
<Route exact path="/search" component={SearchResultsPage} />
<Route
exact
path="/services/:id"
component={ServiceListingPage}
/>
<Route
exact
path="/service-handout/:id"
component={ServicePdfPage}
/>
<Route
exact
path="/intimate-partner-violence-handout/:id"
component={IntimatePartnerViolencePdfPage}
/>
<Route
exact
path="/terms-of-service"
component={TermsOfServicePage}
/>
<Route
exact
path="/:categorySlug/form"
component={ServiceDiscoveryForm}
/>
<Route
exact
path="/:categorySlug/results"
component={ServiceDiscoveryResults}
/>
<Route
exact
path="/breaking-news/edit"
component={EditBreakingNewsPage}
/>
<Route exact path="/log-in" component={LoginPage} />
<Route exact path="/sign-up" component={SignUpPage} />
<Route exact path="/log-out" component={LogoutPage} />

{/* UCSF white label paths */}
<Route
exact
path="/find-services/:selectedResourceSlug"
component={UcsfDiscoveryForm}
/>
{/* Legacy redirects */}
<Redirect path="/resource/new" to="/organizations/new" />
<Route
exact
path="/resource/edit"
component={RedirectToOrganizationsEdit}
/>
<Route
exact
path="/resource"
component={RedirectToOrganizations}
/>
<Redirect to="/" />
</Switch>
<Router setPopUpMessage={setPopUpMessage} />
</div>
{popUpMessage && <PopUpMessage popUpMessage={popUpMessage} />}
</div>
Expand Down
120 changes: 120 additions & 0 deletions app/Router.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,120 @@
import type { PopupMessageProp } from "components/ui";
import React from "react";
import { Switch, Route, Redirect } from "react-router-dom";

import { whiteLabel } from "utils";

import { HomePage } from "pages/HomePage";
import { AboutPage } from "pages/AboutPage";
import { ListingDebugPage } from "pages/debug/ListingDemoPage";
import { OrganizationListingPage } from "pages/OrganizationListingPage";
import { PrivacyPolicyPage } from "pages/legal/PrivacyPolicy";
import {
RedirectToOrganizations,
RedirectToOrganizationsEdit,
} from "pages/LegacyRedirects";
import { ResourceGuides, ResourceGuide } from "pages/ResourceGuides";
import { SearchResultsPage } from "pages/SearchResultsPage/SearchResultsPage";
import { ServiceListingPage } from "pages/ServiceListingPage";
import { ServicePdfPage } from "pages/Pdf/ServicePdfPage";
import { IntimatePartnerViolencePdfPage } from "pages/Pdf/IntimatePartnerViolencePdfPage";
import { TermsOfServicePage } from "pages/legal/TermsOfService";
import { UcsfHomePage } from "pages/UcsfHomePage/UcsfHomePage";
import { UcsfDiscoveryForm } from "pages/UcsfDiscoveryForm/UcsfDiscoveryForm";
import OrganizationEditPage from "pages/OrganizationEditPage";
import { EditBreakingNewsPage } from "pages/EditBreakingNewsPage";
import { ServiceDiscoveryForm } from "pages/ServiceDiscoveryForm";
import { ServiceDiscoveryResults } from "pages/ServiceDiscoveryResults";
import { LoginPage } from "pages/Auth/LoginPage";
import { SignUpPage } from "pages/Auth/SignUpPage";
import { LogoutPage } from "pages/Auth/LogoutPage";

const { homePageComponent } = whiteLabel;

const homePageDictionary = {
HomePage,
UcsfHomePage,
};

const homePage = homePageDictionary[homePageComponent];

export const Router = ({
setPopUpMessage,
}: {
setPopUpMessage: (msg: PopupMessageProp) => void;
}) => {
return (
<Switch>
<Route exact path="/" component={homePage} />
<Route exact path="/about" component={AboutPage} />
<Route exact path="/demo/listing" component={ListingDebugPage} />
{/* NB: /organizations/new must be listed before /organizations/:id or else the /new
step will be interpreted as an ID and will thus break the OrganizationEditPage */}
<Route
exact
path="/organizations/new"
render={(props) => (
<OrganizationEditPage {...props} showPopUpMessage={setPopUpMessage} />
)}
/>
<Route
exact
path="/organizations/:id"
component={OrganizationListingPage}
/>
<Route
exact
path="/organizations/:id/edit"
render={(props) => (
<OrganizationEditPage {...props} showPopUpMessage={setPopUpMessage} />
)}
/>
<Route exact path="/privacy-policy" component={PrivacyPolicyPage} />
<Route exact path="/resource-guides" component={ResourceGuides} />
<Route exact path="/resource-guides/:id" component={ResourceGuide} />
<Route exact path="/search" component={SearchResultsPage} />
<Route exact path="/services/:id" component={ServiceListingPage} />
<Route exact path="/service-handout/:id" component={ServicePdfPage} />
<Route
exact
path="/intimate-partner-violence-handout/:id"
component={IntimatePartnerViolencePdfPage}
/>
<Route exact path="/terms-of-service" component={TermsOfServicePage} />
<Route
exact
path="/:categorySlug/form"
component={ServiceDiscoveryForm}
/>
<Route
exact
path="/:categorySlug/results"
component={ServiceDiscoveryResults}
/>
<Route
exact
path="/breaking-news/edit"
component={EditBreakingNewsPage}
/>
<Route exact path="/log-in" component={LoginPage} />
<Route exact path="/sign-up" component={SignUpPage} />
<Route exact path="/log-out" component={LogoutPage} />

{/* UCSF white label paths */}
<Route
exact
path="/find-services/:selectedResourceSlug"
component={UcsfDiscoveryForm}
/>
{/* Legacy redirects */}
<Redirect path="/resource/new" to="/organizations/new" />
<Route
exact
path="/resource/edit"
component={RedirectToOrganizationsEdit}
/>
<Route exact path="/resource" component={RedirectToOrganizations} />
<Redirect to="/" />
</Switch>
);
};
Empty file added app/components/utils/index.ts
Empty file.

0 comments on commit f03a01a

Please sign in to comment.