Skip to content

Commit

Permalink
revert: React/TS Upgrades (#2268)
Browse files Browse the repository at this point in the history 
* Revert "chore: Upgrade React to v18 (#2251)"

This reverts commit 6834631.

* Revert "Upgrade TS to v5. (#2259)"

This reverts commit c9485e6.
  • Loading branch information
@cmaddox5
cmaddox5 authored Oct 28, 2024
1 parent 704c895 commit d6ef9ec
Show file tree
Hide file tree
Showing 24 changed files with 487 additions and 478 deletions.
261 changes: 181 additions & 80 deletions assets/package-lock.json
View file

Large diffs are not rendered by default.

18 changes: 10 additions & 8 deletions assets/package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -24,13 +24,13 @@
"lodash": "^4.17.21",
"moment": "^2.30.1",
"moment-timezone": "^0.5.46",
"qrcode.react": "^4.0.1",
"qrcode.react": "^1.0.1",
"raven-js": "^3.27.2",
"react": "^18.3.1",
"react-dom": "^18.3.1",
"react-dropzone": "^14.2.9",
"react-router-dom": "^6.27.0",
"react-table": "^7.8.0",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-dropzone": "^11.3.4",
"react-router-dom": "^5.2.0",
"react-table": "^7.7.0",
"react-transition-group": "^4.4.5",
"regenerator-runtime": "^0.13.7",
"weak-key": "^1.0.3"
Expand All @@ -50,7 +50,9 @@
"@sentry/webpack-plugin": "^2.22.6",
"@svgr/webpack": "^5.5.0",
"@types/lodash": "^4.17.12",
"@types/react": "^18.3.11",
"@types/react": "^17.0.14",
"@types/react-dom": "^17.0.9",
"@types/react-router-dom": "^5.1.8",
"@types/webpack-env": "^1.18.4",
"babel-loader": "^8.2.2",
"concurrently": "^8.2.2",
Expand Down Expand Up @@ -79,7 +81,7 @@
"terser-webpack-plugin": "^4.2.3",
"ts-jest": "^29.1.2",
"ts-loader": "^8.3.0",
"typescript": "^5.6.3",
"typescript": "^4.3.5",
"typescript-eslint": "^7.8.0",
"webpack": "^4.46.0",
"webpack-cli": "^4.7.2",
Expand Down
18 changes: 9 additions & 9 deletions assets/src/apps/admin.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
require("../../css/admin.scss");

import React, { ComponentType } from "react";
import { createRoot } from "react-dom/client";
import ReactDOM from "react-dom";
import {
BrowserRouter as Router,
NavLink,
Route,
Routes,
Switch,
} from "react-router-dom";
import weakKey from "weak-key";

Expand Down Expand Up @@ -51,25 +51,25 @@ const App = (): JSX.Element => {
{routes.map((group) => (
<div key={weakKey(group)} className="admin-navbar__group">
{group.map(([path, label]) => (
<NavLink to={"/" + path} key={path}>
<NavLink exact to={"/" + path} key={path}>
{label}
</NavLink>
))}
</div>
))}
</div>

<Routes>
<Switch>
{routes.map((group) =>
group.map(([path, , Component]) => (
<Route path={"/" + path} key={path} element={<Component />}></Route>
<Route exact path={"/" + path} key={path}>
<Component />
</Route>
)),
)}
</Routes>
</Switch>
</Router>
);
};

const container = document.getElementById("app");
const root = createRoot(container!);
root.render(<App />);
ReactDOM.render(<App />, document.getElementById("app"));
35 changes: 14 additions & 21 deletions assets/src/apps/gl_eink_single.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@ initSentry("gl_eink_single");
require("../../css/gl_eink_single.scss");

import React from "react";
import { createRoot } from "react-dom/client";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import ReactDOM from "react-dom";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

import ScreenContainer, {
ScreenLayout,
Expand All @@ -20,26 +20,19 @@ import {
const App = (): JSX.Element => {
return (
<Router>
<Routes>
<Route
path="/screen/gl_eink_single"
element={<MultiScreenPage screenContainer={ScreenContainer} />}
/>

<Route
path="/audit/gl_eink_single"
element={<AuditScreenPage screenLayout={ScreenLayout} />}
/>

<Route
path="/screen/:id"
element={<ScreenPage screenContainer={ScreenContainer} />}
/>
</Routes>
<Switch>
<Route exact path="/screen/gl_eink_single">
<MultiScreenPage screenContainer={ScreenContainer} />
</Route>
<Route exact path="/audit/gl_eink_single">
<AuditScreenPage screenLayout={ScreenLayout} />
</Route>
<Route path="/screen/:id">
<ScreenPage screenContainer={ScreenContainer} />
</Route>
</Switch>
</Router>
);
};

const container = document.getElementById("app");
const root = createRoot(container!);
root.render(<App />);
ReactDOM.render(<App />, document.getElementById("app"));
35 changes: 14 additions & 21 deletions assets/src/apps/solari.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ initFullstory();
require("../../css/solari.scss");

import React, { useEffect } from "react";
import { createRoot } from "react-dom/client";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import ReactDOM from "react-dom";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";

import ScreenContainer, {
ScreenLayout,
Expand All @@ -25,22 +25,17 @@ const App = (): JSX.Element => {

return (
<Router>
<Routes>
<Route
path="/screen/solari"
element={<MultiScreenPage screenContainer={ScreenContainer} />}
/>

<Route
path="/audit/solari"
element={<AuditScreenPage screenLayout={ScreenLayout} />}
/>

<Route
path="/screen/:id"
element={<ScreenPage screenContainer={ScreenContainer} />}
/>
</Routes>
<Switch>
<Route exact path="/screen/solari">
<MultiScreenPage screenContainer={ScreenContainer} />
</Route>
<Route exact path="/audit/solari">
<AuditScreenPage screenLayout={ScreenLayout} />
</Route>
<Route path="/screen/:id">
<ScreenPage screenContainer={ScreenContainer} />
</Route>
</Switch>
</Router>
);
};
Expand All @@ -62,6 +57,4 @@ const handleWatchdogMessage = (ev: MessageEvent) => {
}
};

const container = document.getElementById("app");
const root = createRoot(container!);
root.render(<App />);
ReactDOM.render(<App />, document.getElementById("app"));
81 changes: 35 additions & 46 deletions assets/src/apps/v2/bus_eink.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ initFullstory();
require("../../../css/bus_eink_v2.scss");

import React from "react";
import { createRoot } from "react-dom/client";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import ReactDOM from "react-dom";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import ScreenPage from "Components/v2/screen_page";
import { MappingContext } from "Components/v2/widget";

Expand Down Expand Up @@ -93,52 +93,41 @@ const responseMapper: ResponseMapper = (apiResponse) => {
const App = (): JSX.Element => {
return (
<Router>
<Routes>
<Switch>
<Route exact path="/v2/screen/bus_eink_v2">
<MultiScreenPage
components={TYPE_TO_COMPONENT}
responseMapper={responseMapper}
/>
</Route>
<Route exact path={["/v2/screen/:id", "/v2/screen/pending/:id"]}>
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<ScreenPage />
</ResponseMapperContext.Provider>
</MappingContext.Provider>
</Route>
<Route exact path="/v2/widget/bus_eink_v2">
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<WidgetPage />
</MappingContext.Provider>
</Route>
<Route
path="/v2/screen/bus_eink_v2"
element={
<MultiScreenPage
components={TYPE_TO_COMPONENT}
responseMapper={responseMapper}
/>
}
/>

<Route
path="/v2/screen/pending?/:id"
element={
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<ScreenPage />
</ResponseMapperContext.Provider>
</MappingContext.Provider>
}
/>

<Route
path="/v2/widget/bus_eink_v2"
element={
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<WidgetPage />
</MappingContext.Provider>
}
/>

<Route
path="/v2/screen/pending?/:id/simulation"
element={
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<SimulationScreenPage />
</ResponseMapperContext.Provider>
</MappingContext.Provider>
}
/>
</Routes>
exact
path={[
"/v2/screen/:id/simulation",
"/v2/screen/pending/:id/simulation",
]}
>
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<SimulationScreenPage />
</ResponseMapperContext.Provider>
</MappingContext.Provider>
</Route>
</Switch>
</Router>
);
};

const container = document.getElementById("app");
const root = createRoot(container!);
root.render(<App />);
ReactDOM.render(<App />, document.getElementById("app"));
75 changes: 34 additions & 41 deletions assets/src/apps/v2/bus_shelter.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,8 +7,8 @@ initFullstory();
require("../../../css/bus_shelter_v2.scss");

import React from "react";
import { createRoot } from "react-dom/client";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import ReactDOM from "react-dom";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import ScreenPage from "Components/v2/screen_page";
import {
ResponseMapper,
Expand Down Expand Up @@ -122,47 +122,40 @@ const getAudioConfig = (): AudioConfig | null => {
const App = (): JSX.Element => {
return (
<Router>
<Routes>
<Switch>
<Route exact path="/v2/screen/bus_shelter_v2">
<MultiScreenPage
components={TYPE_TO_COMPONENT}
responseMapper={responseMapper}
/>
</Route>
<Route exact path={["/v2/screen/:id", "/v2/screen/pending/:id"]}>
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<BlinkConfigContext.Provider value={blinkConfig}>
<AudioConfigContext.Provider value={getAudioConfig()}>
<ScreenPage />
</AudioConfigContext.Provider>
</BlinkConfigContext.Provider>
</ResponseMapperContext.Provider>
</MappingContext.Provider>
</Route>
<Route
path="/v2/screen/bus_shelter_v2"
element={
<MultiScreenPage
components={TYPE_TO_COMPONENT}
responseMapper={responseMapper}
/>
}
/>

<Route
path="/v2/screen/pending?/:id"
element={
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<BlinkConfigContext.Provider value={blinkConfig}>
<AudioConfigContext.Provider value={getAudioConfig()}>
<ScreenPage />
</AudioConfigContext.Provider>
</BlinkConfigContext.Provider>
</ResponseMapperContext.Provider>
</MappingContext.Provider>
}
/>

<Route
path="/v2/screen/pending?/:id/simulation"
element={
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<SimulationScreenPage />
</ResponseMapperContext.Provider>
</MappingContext.Provider>
}
/>
</Routes>
exact
path={[
"/v2/screen/:id/simulation",
"/v2/screen/pending/:id/simulation",
]}
>
<MappingContext.Provider value={TYPE_TO_COMPONENT}>
<ResponseMapperContext.Provider value={responseMapper}>
<SimulationScreenPage />
</ResponseMapperContext.Provider>
</MappingContext.Provider>
</Route>
</Switch>
</Router>
);
};

const container = document.getElementById("app");
const root = createRoot(container!);
root.render(<App />);
ReactDOM.render(<App />, document.getElementById("app"));
Loading

0 comments on commit d6ef9ec

Please sign in to comment.