Fix CLS (#344)

* Slight updates * Fix the build of electron * Run prettier
cohstats · Jun 2, 2024 · 5b1c599 · 5b1c599
1 parent 1ec24d8
commit 5b1c599
Show file tree

Hide file tree

Showing 9 changed files with 616 additions and 512 deletions.
diff --git a/packages/app/package.json b/packages/app/package.json
@@ -35,21 +35,21 @@
     "@types/tcp-port-used": "1.0.4",
     "@types/uuid": "8.3.4",
     "@vercel/webpack-asset-relocator-loader": "1.7.3",
-    "css-loader": "6.5.1",
+    "css-loader": "6.0.0",
     "electron": "22.3.27",
     "file-loader": "6.2.0",
     "fork-ts-checker-webpack-plugin": "6.5.0",
     "node-loader": "2.0.0",
     "rimraf": "3.0.2",
-    "style-loader": "3.3.1",
-    "ts-loader": "9.2.6",
+    "style-loader": "3.0.0",
+    "ts-loader": "9.2.2",
     "typescript": "4.9.5",
     "url-loader": "4.1.1"
   },
   "dependencies": {
     "@ant-design/icons": "4.8.0",
     "@reduxjs/toolkit": "1.7.1",
-    "antd": "4.24.16",
+    "antd": "4.24.3",
     "axios": "1.6.8",
     "compare-versions": "4.1.4",
     "date-fns": "2.29.3",

diff --git a/packages/web/package.json b/packages/web/package.json
@@ -22,11 +22,11 @@
     "connected-react-router": "6.9.3",
     "date-fns": "2.29.3",
     "dayjs": "1.11.11",
-    "firebase": "9.12.1",
+    "firebase": "9.23.0",
     "history": "4.10.1",
     "javascript-time-ago": "2.5.10",
     "react": "17.0.2",
-    "react-country-flag": "3.0.2",
+    "react-country-flag": "3.1.0",
     "react-dom": "17.0.2",
     "react-redux": "7.2.8",
     "react-responsive": "9.0.0-beta.10",
@@ -42,7 +42,7 @@
     "@types/history": "4.7.11",
     "@types/javascript-time-ago": "2.0.8",
     "@types/jest": "27.5.2",
-    "@types/node": "^16.7.2",
+    "@types/node": "^20.13.0",
     "@types/react": "17.0.34",
     "@types/react-dom": "17.0.11",
     "@types/react-redux": "7.1.20",

diff --git a/packages/web/src/components/main-home.tsx b/packages/web/src/components/main-home.tsx
@@ -10,7 +10,7 @@ import RedditCard from "./reddit/reddit-card";
 const { Title, Paragraph, Text } = Typography;
 
 const MainHome: React.FC = () => {
-  const [analyzedMatches, setAnalyzedMatches] = useState(". . .");
+  const [analyzedMatches, setAnalyzedMatches] = useState("8,562,482");
 
   useEffect(() => {
     try {

diff --git a/packages/web/src/pages/ladders/leaderboards.tsx b/packages/web/src/pages/ladders/leaderboards.tsx
@@ -492,7 +492,7 @@ const Leaderboards = () => {
             </Space>
           </Col>
         </Row>
-        <Row justify="center" style={{ padding: "10px" }}>
+        <Row justify="center" style={{ padding: "10px", minHeight: "2500px" }}>
           <Col xs={24} xxl={17}>
             <div style={{ fontSize: "large", paddingBottom: 15, paddingTop: 15 }}>
               <div style={{ float: "left" }}>

diff --git a/packages/web/src/pages/live-matches/live-matches.tsx b/packages/web/src/pages/live-matches/live-matches.tsx
@@ -147,7 +147,7 @@ const LiveMatches: React.FC = () => {
             </div>
           </Col>
         </Row>
-        <Row justify="center" style={{ paddingTop: 10 }}>
+        <Row justify="center" style={{ paddingTop: 10, minHeight: "1500px" }}>
           <Col span={24}>
             <LiveMatchesTable changeRoute={changeRoute} currentLiveGamesData={data} />
           </Col>

diff --git a/packages/web/src/pages/players/player-card/player-card.tsx b/packages/web/src/pages/players/player-card/player-card.tsx
@@ -149,7 +149,7 @@ const PlayerCard = () => {
       });
     } else {
       return (
-        <div style={{ paddingTop: 50 }}>
+        <div style={{ paddingTop: 250, minHeight: "1500px" }}>
           <Loading />
         </div>
       );

diff --git a/packages/web/src/pages/recent-matches/recent-matches.tsx b/packages/web/src/pages/recent-matches/recent-matches.tsx
@@ -35,7 +35,7 @@ const RecentMatches: React.FC = () => {
   const [isLoading, setIsLoading] = useState(true);
   const [matchRecords, setMatchRecords] = useState<Array<Record<string, any>>>([]);
   const [error, setError] = useState<null | string>(null);
-  const [totalMatches, setTotalMatches] = useState<string | number>("...");
+  const [totalMatches, setTotalMatches] = useState<string | number>("200,000");
 
   const isMobile = useMediaQuery({ query: isMobileMediaQuery });
 
@@ -259,7 +259,7 @@ const RecentMatches: React.FC = () => {
   })();
 
   return (
-    <Row justify="center" style={{ paddingTop: "10px" }}>
+    <Row justify="center" style={{ paddingTop: "10px", minHeight: "1500px" }}>
       <Col xs={23} md={22} xxl={16}>
         <div style={{ textAlign: "center" }}>
           <Title>Most recent games</Title>

diff --git a/packages/web/src/pages/stats/custom-stats.tsx b/packages/web/src/pages/stats/custom-stats.tsx
@@ -276,7 +276,7 @@ const CustomStats: React.FC = () => {
   };
 
   return (
-    <div>
+    <div style={{ minHeight: "1500px" }}>
       <div>
         <Space
           style={{ display: "flex", alignItems: "center", justifyContent: "center", padding: 10 }}
-Original file line number
+Diff line change
@@ Expand Up / @@ -276,7 +276,7 @@ const CustomStats: React.FC = () => { @@
       };
       return (
-        <div>
+        <div style={{ minHeight: "1500px" }}>
           <div>
             <Space
               style={{ display: "flex", alignItems: "center", justifyContent: "center", padding: 10 }}
@@ Expand Down @@