feat: add boilerplate
This commit is contained in:
doprz
BIN
src/assets/UT-Map.png
Normal file
BIN
src/assets/UT-Map.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 227 KiB |
17
src/pages/map/Map.tsx
Normal file
17
src/pages/map/Map.tsx
Normal file
@@ -0,0 +1,17 @@
|
||||
import DialogProvider from '@views/components/common/DialogProvider/DialogProvider';
|
||||
import ExtensionRoot from '@views/components/common/ExtensionRoot/ExtensionRoot';
|
||||
import Map from '@views/components/map/Map';
|
||||
import React from 'react';
|
||||
|
||||
/**
|
||||
* Renders the map page for the UTRP (UT Registration Plus) extension.
|
||||
*/
|
||||
export default function MapPage() {
|
||||
return (
|
||||
<ExtensionRoot>
|
||||
<DialogProvider>
|
||||
<Map />
|
||||
</DialogProvider>
|
||||
</ExtensionRoot>
|
||||
);
|
||||
}
|
||||
16
src/pages/map/index.html
Normal file
16
src/pages/map/index.html
Normal file
@@ -0,0 +1,16 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1" />
|
||||
<meta name="theme-color" content="#000000" />
|
||||
<title>UTRP Map</title>
|
||||
</head>
|
||||
|
||||
<body style="min-height: 100vh; height: 0; margin: 0">
|
||||
<noscript>You need to enable JavaScript to run this app.</noscript>
|
||||
<div id="root"></div>
|
||||
|
||||
<script src="./index.tsx" type="module"></script>
|
||||
</body>
|
||||
</html>
|
||||
6
src/pages/map/index.tsx
Normal file
6
src/pages/map/index.tsx
Normal file
@@ -0,0 +1,6 @@
|
||||
import React from 'react';
|
||||
import { createRoot } from 'react-dom/client';
|
||||
|
||||
import Map from './Map';
|
||||
|
||||
createRoot(document.getElementById('root')!).render(<Map />);
|
||||
60
src/views/components/map/Map.tsx
Normal file
60
src/views/components/map/Map.tsx
Normal file
@@ -0,0 +1,60 @@
|
||||
import { Button } from '@views/components/common/Button';
|
||||
import Divider from '@views/components/common/Divider';
|
||||
import { LargeLogo } from '@views/components/common/LogoIcon';
|
||||
import Text from '@views/components/common/Text/Text';
|
||||
import useChangelog from '@views/hooks/useChangelog';
|
||||
import React from 'react';
|
||||
|
||||
import IconoirGitFork from '~icons/iconoir/git-fork';
|
||||
|
||||
import CalendarFooter from '../calendar/CalendarFooter';
|
||||
import { CalendarSchedules } from '../calendar/CalendarSchedules';
|
||||
import ImportantLinks from '../calendar/ImportantLinks';
|
||||
import TeamLinks from '../calendar/TeamLinks';
|
||||
|
||||
const manifest = chrome.runtime.getManifest();
|
||||
const LDIconURL = new URL('/src/assets/LD-icon.png', import.meta.url).href;
|
||||
const UTMapURL = new URL('/src/assets/UT-Map.png', import.meta.url).href;
|
||||
|
||||
/**
|
||||
* Renders the map component for the UTRP (UT Registration Plus) extension.
|
||||
*/
|
||||
export default function Map(): JSX.Element {
|
||||
const handleChangelogOnClick = useChangelog();
|
||||
|
||||
return (
|
||||
<div>
|
||||
<header className='flex items-center gap-5 overflow-x-auto overflow-y-hidden border-b border-ut-offwhite px-7 py-4 md:overflow-x-hidden'>
|
||||
<LargeLogo />
|
||||
<Divider className='mx-2 self-center md:mx-4' size='2.5rem' orientation='vertical' />
|
||||
<Text variant='h1' className='flex-1 text-ut-burntorange'>
|
||||
UTRP Map
|
||||
</Text>
|
||||
<div className='hidden flex-row items-center justify-end gap-6 screenshot:hidden lg:flex'>
|
||||
<Button variant='single' color='theme-black' onClick={handleChangelogOnClick}>
|
||||
<IconoirGitFork className='h-6 w-6 text-ut-gray' />
|
||||
<Text variant='small' className='text-ut-gray font-normal'>
|
||||
v{manifest.version} - {process.env.NODE_ENV}
|
||||
</Text>
|
||||
</Button>
|
||||
<img src={LDIconURL} alt='LD Icon' className='h-10 w-10 rounded-lg' />
|
||||
</div>
|
||||
</header>
|
||||
<div className='h-full flex flex-row'>
|
||||
<div className='h-full flex flex-none flex-col justify-between pb-5 screenshot:hidden'>
|
||||
<div className='mb-3 h-full w-fit flex flex-col overflow-auto pb-2 pl-4.5 pr-4 pt-5'>
|
||||
<CalendarSchedules />
|
||||
<Divider orientation='horizontal' size='100%' className='my-5' />
|
||||
<ImportantLinks />
|
||||
<Divider orientation='horizontal' size='100%' className='my-5' />
|
||||
<TeamLinks />
|
||||
</div>
|
||||
<CalendarFooter />
|
||||
</div>
|
||||
<div className='flex p-12'>
|
||||
<img src={UTMapURL} alt='LD Icon' />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -142,6 +142,7 @@ export default defineConfig({
|
||||
renameFile('src/pages/options/index.html', 'options.html'),
|
||||
renameFile('src/pages/calendar/index.html', 'calendar.html'),
|
||||
renameFile('src/pages/report/index.html', 'report.html'),
|
||||
renameFile('src/pages/map/index.html', 'map.html'),
|
||||
vitePluginRunCommandOnDemand({
|
||||
afterServerStart: 'pnpm gulp forceDisableUseDynamicUrl',
|
||||
closeBundle: 'pnpm gulp forceDisableUseDynamicUrl',
|
||||
@@ -181,6 +182,10 @@ export default defineConfig({
|
||||
target: 'http://localhost:5173',
|
||||
rewrite: path => path.replace('report', 'src/pages/report/index'),
|
||||
},
|
||||
'/map.html': {
|
||||
target: 'http://localhost:5173',
|
||||
rewrite: path => path.replace('map', 'src/pages/map/index'),
|
||||
},
|
||||
},
|
||||
},
|
||||
build: {
|
||||
@@ -194,6 +199,7 @@ export default defineConfig({
|
||||
calendar: 'src/pages/calendar/index.html',
|
||||
options: 'src/pages/options/index.html',
|
||||
report: 'src/pages/report/index.html',
|
||||
map: 'src/pages/map/index.html',
|
||||
},
|
||||
output: {
|
||||
chunkFileNames: `assets/[name]-[hash].js`,
|
||||
|
||||
Reference in New Issue
Block a user