From 16f837ffe878d00d593184a38b0166297506e718 Mon Sep 17 00:00:00 2001 From: Amos Tan Date: Sun, 26 Nov 2023 23:27:46 +0800 Subject: [PATCH 1/6] feat(redirect): Modify page to show warning --- src/pages/index.tsx | 105 ++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 96 insertions(+), 9 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 8d20878..4d31ca9 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,17 +1,104 @@ import { NextPage } from 'next'; -import { useRouter } from 'next/router'; +// import { useRouter } from 'next/router'; import React from 'react'; +import styled from 'styled-components'; -export const ClassMaidHome: NextPage = function () { - // NOTE: (hello@amostan.me) Temp redirect to `/smu` page - // TODO: (hello@amostan.me) Build home page to select different schools - const { push } = useRouter(); +import { CardTemplate } from '../screens/smu/components/widget/styled'; +import TodaySummaryWidget from '../screens/smu/components/widget/TodaySummary'; +import useWidgetSize from '../shared/hooks/useWidgetSize'; +import { MOBILE_WIDTH_SIZE_L } from '../shared/themes/size'; + +const MainWrapper = styled.div` + display: grid; + height: 100dvh; + justify-content: center; + align-items: center; + + @media screen and (max-width: ${MOBILE_WIDTH_SIZE_L}) { + display: flex; + flex-direction: column; + justify-content: flex-start; + } +`; + +const ContentWrapper = styled.div` + display: grid; + gap: 1em; + align-content: center; + align-items: center; + grid-template-areas: 'image message'; + + @media screen and (max-width: ${MOBILE_WIDTH_SIZE_L}) { + display: flex; + flex-direction: column; + } +`; + +const WidgetWrapper = styled.div` + grid-area: image; + display: flex; + justify-content: flex-end; +`; + +const MessageWrapper = styled.div` + grid-area: message; + display: flex; +`; - React.useEffect(() => { - push('/smu'); - }, [push]); +const Header = styled.h1` + font-size: 2.25rem; + margin: 0; + color: ${(props) => props.theme.textColor[10]}; + + @media screen and (max-width: ${MOBILE_WIDTH_SIZE_L}) { + font-size: 1.85rem; + } +`; + +const Message = styled.p` + margin-top: 8px; + margin-bottom: 8px; + font-size: 1.35rem; + color: ${(props) => props.theme.textColor[20]}; + line-height: 2rem; + font-weight: 500; + + a { + color: ${(props) => props.theme.primary[50]}; + text-decoration-color: ${(props) => props.theme.primary[50]}; + } + + @media screen and (max-width: ${MOBILE_WIDTH_SIZE_L}) { + font-size: 1.2rem; + } +`; + +export const ClassMaidHome: NextPage = function () { + const widgetSize = useWidgetSize('large'); - return
; + return ( + + + + + + + +
We have rebranded!
+ + { + "Don't worry, everything you loved about SMU Shortcuts can be found in " + } + Classmaid.sg! + + + Click the link if you are not redirected immediately. + + + + + + ); }; export default ClassMaidHome; From 7ba4defb116f41cdeaec303d801080a567db2b82 Mon Sep 17 00:00:00 2001 From: Amos Tan Date: Sun, 26 Nov 2023 23:27:52 +0800 Subject: [PATCH 2/6] refactor: clean --- src/pages/smu/calendar.tsx | 38 ------------------------ src/pages/smu/index.tsx | 61 -------------------------------------- 2 files changed, 99 deletions(-) delete mode 100644 src/pages/smu/calendar.tsx delete mode 100644 src/pages/smu/index.tsx diff --git a/src/pages/smu/calendar.tsx b/src/pages/smu/calendar.tsx deleted file mode 100644 index 1ba0687..0000000 --- a/src/pages/smu/calendar.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import React from 'react'; -import styled from 'styled-components'; - -import CalendarList from '../../screens/smu/components/widget/Calendar/CalendarList'; -import DefaultLayout from '../../shared/components/layouts/DefaultLayout'; - -const Wrapper = styled.div` - box-sizing: border-box; - display: flex; - height: 100%; - - padding-top: 24px; - padding-bottom: max(24px, env(safe-area-inset-bottom)); - padding-left: max(16px, env(safe-area-inset-left)); - padding-right: max(16px, env(safe-area-inset-right)); - - @media screen and (max-width: ${(props) => props.theme.mobileSize}) { - padding-top: 16px; - padding-bottom: max(16px, env(safe-area-inset-bottom)); - padding-left: max(8px, env(safe-area-inset-left)); - padding-right: max(8px, env(safe-area-inset-right)); - - flex-direction: column; - overflow-y: auto; - } -`; - -export const Calendar: React.FC = () => { - return ( - - - - - - ); -}; - -export default Calendar; diff --git a/src/pages/smu/index.tsx b/src/pages/smu/index.tsx deleted file mode 100644 index f5e25e4..0000000 --- a/src/pages/smu/index.tsx +++ /dev/null @@ -1,61 +0,0 @@ -import type { NextPage } from 'next'; -import React from 'react'; -import styled from 'styled-components'; - -import AppLibrary from '../../screens/smu/components/widget/AppLibrary'; -import LibraryCapacities from '../../screens/smu/components/widget/LibraryCapacities'; -import TodaySummaryWidget from '../../screens/smu/components/widget/TodaySummary'; -import DefaultLayout from '../../shared/components/layouts/DefaultLayout'; -import { - DESKTOP_WIDTH_SIZE_M, - DESKTOP_WIDTH_SIZE_S, - MOBILE_WIDTH_SIZE_L, - MOBILE_WIDTH_SIZE_S, -} from '../../shared/themes/size'; - -const ContentWrapper = styled.div` - box-sizing: border-box; - display: flex; - justify-content: center; -`; - -const Wrapper = styled.div` - width: 1020px; - display: flex; - flex-wrap: wrap; - - padding-top: 40px; - padding-bottom: 64px; - - @media screen and (max-width: ${DESKTOP_WIDTH_SIZE_M}) { - width: 920px; - } - - @media screen and (max-width: ${DESKTOP_WIDTH_SIZE_S}) { - width: 700px; - } - - @media screen and (max-width: ${MOBILE_WIDTH_SIZE_L}) { - width: 90%; - } - - @media screen and (max-width: ${MOBILE_WIDTH_SIZE_S}) { - justify-content: center; - } -`; - -export const Home: NextPage = function () { - return ( - - - - - - - - - - ); -}; - -export default Home; From 6747f0a1e45e2c5f5cd3df25ceeb8a83bacc6c94 Mon Sep 17 00:00:00 2001 From: Amos Tan Date: Sun, 26 Nov 2023 23:34:12 +0800 Subject: [PATCH 3/6] refactor: update message and mobile size --- src/pages/index.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 4d31ca9..df7ba2d 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -31,6 +31,7 @@ const ContentWrapper = styled.div` @media screen and (max-width: ${MOBILE_WIDTH_SIZE_L}) { display: flex; flex-direction: column; + gap: 0; } `; @@ -69,7 +70,8 @@ const Message = styled.p` } @media screen and (max-width: ${MOBILE_WIDTH_SIZE_L}) { - font-size: 1.2rem; + font-size: 1rem; + line-height: 1.5rem; } `; @@ -92,7 +94,8 @@ export const ClassMaidHome: NextPage = function () { Classmaid.sg! - Click the link if you are not redirected immediately. + You will be redirected in 5 seconds. Click the link if you are not + redirected immediately. From de44b172e95a291513884b02d01db68b37f5f979 Mon Sep 17 00:00:00 2001 From: Amos Tan Date: Sun, 26 Nov 2023 23:54:05 +0800 Subject: [PATCH 4/6] feat: redirect to classmaid url --- next.config.js | 1 + src/pages/index.tsx | 16 ++++++++++++++-- 2 files changed, 15 insertions(+), 2 deletions(-) diff --git a/next.config.js b/next.config.js index 5f2e76d..5fa2801 100644 --- a/next.config.js +++ b/next.config.js @@ -34,5 +34,6 @@ module.exports = { env: { SMU_SCRAPER_URL: process.env.SMU_SCRAPER_URL, SCHOOL_SEMESTERS_URL: process.env.SCHOOL_SEMESTERS_URL, + CLASSMAID_URL: process.env.CLASSMAID_URL, }, }; diff --git a/src/pages/index.tsx b/src/pages/index.tsx index df7ba2d..0c7468c 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -1,5 +1,5 @@ import { NextPage } from 'next'; -// import { useRouter } from 'next/router'; +import { useRouter } from 'next/router'; import React from 'react'; import styled from 'styled-components'; @@ -76,7 +76,19 @@ const Message = styled.p` `; export const ClassMaidHome: NextPage = function () { + const router = useRouter(); const widgetSize = useWidgetSize('large'); + const redirectUrl = `${process.env.CLASSMAID_URL ?? 'http://localhost:3000'}`; + + console.log(redirectUrl); + + React.useEffect(() => { + const redirect = setTimeout(() => { + router.push(redirectUrl); + }, 5000); + + return () => clearTimeout(redirect); + }, [redirectUrl, router]); return ( @@ -91,7 +103,7 @@ export const ClassMaidHome: NextPage = function () { { "Don't worry, everything you loved about SMU Shortcuts can be found in " } - Classmaid.sg! + Classmaid.sg! You will be redirected in 5 seconds. Click the link if you are not From fd84e23d53f693d395e2b7a0db4390c28415ac10 Mon Sep 17 00:00:00 2001 From: Amos Tan Date: Mon, 27 Nov 2023 00:24:19 +0800 Subject: [PATCH 5/6] build: app netlify.toml --- netlify.toml | 3 +++ 1 file changed, 3 insertions(+) create mode 100644 netlify.toml diff --git a/netlify.toml b/netlify.toml new file mode 100644 index 0000000..8057155 --- /dev/null +++ b/netlify.toml @@ -0,0 +1,3 @@ +[build] + command = "yarn build" + publish = ".next" \ No newline at end of file From 74ea8e89cc5c44bf26e40d4cd22faba2ee36c83d Mon Sep 17 00:00:00 2001 From: Amos Tan Date: Mon, 27 Nov 2023 00:25:34 +0800 Subject: [PATCH 6/6] refactor: remove console.log --- src/pages/index.tsx | 2 -- 1 file changed, 2 deletions(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index 0c7468c..f9f7a1a 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -80,8 +80,6 @@ export const ClassMaidHome: NextPage = function () { const widgetSize = useWidgetSize('large'); const redirectUrl = `${process.env.CLASSMAID_URL ?? 'http://localhost:3000'}`; - console.log(redirectUrl); - React.useEffect(() => { const redirect = setTimeout(() => { router.push(redirectUrl);