diff --git a/src/GZCTF/ClientApp/src/App.tsx b/src/GZCTF/ClientApp/src/App.tsx index e56316b22..fcd5053aa 100644 --- a/src/GZCTF/ClientApp/src/App.tsx +++ b/src/GZCTF/ClientApp/src/App.tsx @@ -14,6 +14,7 @@ import { useLocalStorage } from '@mantine/hooks' import { ModalsProvider } from '@mantine/modals' import { Notifications } from '@mantine/notifications' import { ThemeOverride } from '@Utils/ThemeOverride' +import { useBanner } from '@Utils/useConfig' import { fetcher } from '@Api' export const App: FC = () => { @@ -26,6 +27,8 @@ export const App: FC = () => { const toggleColorScheme = (value?: ColorScheme) => setColorScheme(value || (colorScheme === 'dark' ? 'light' : 'dark')) + useBanner() + return ( diff --git a/src/GZCTF/ClientApp/src/pages/About.tsx b/src/GZCTF/ClientApp/src/pages/About.tsx index 03f61d430..e03ec4e77 100644 --- a/src/GZCTF/ClientApp/src/pages/About.tsx +++ b/src/GZCTF/ClientApp/src/pages/About.tsx @@ -21,6 +21,7 @@ const sha = import.meta.env.VITE_APP_GIT_SHA ?? 'unknown' const tag = import.meta.env.VITE_APP_GIT_NAME ?? 'unknown' const timestamp = import.meta.env.VITE_APP_BUILD_TIMESTAMP ?? '' const builtdate = import.meta.env.DEV ? dayjs() : dayjs(timestamp) +const repo = 'https://github.com/GZTimeWalker/GZCTF' const useStyles = createStyles((theme) => ({ title: { @@ -77,7 +78,7 @@ const About: FC = () => { window.open('https://github.com/GZTimeWalker/GZCTF')} + onClick={() => window.open(repo)} style={{ cursor: 'pointer', }} diff --git a/src/GZCTF/ClientApp/src/utils/useConfig.ts b/src/GZCTF/ClientApp/src/utils/useConfig.ts index 1f68b9aeb..e01e925d0 100644 --- a/src/GZCTF/ClientApp/src/utils/useConfig.ts +++ b/src/GZCTF/ClientApp/src/utils/useConfig.ts @@ -1,7 +1,14 @@ -import { useEffect } from 'react' +import dayjs from 'dayjs' +import { useEffect, useRef } from 'react' import { useLocalStorage } from '@mantine/hooks' import api, { GlobalConfig } from '@Api' +const sha = import.meta.env.VITE_APP_GIT_SHA ?? 'unknown' +const tag = import.meta.env.VITE_APP_GIT_NAME ?? 'unknown' +const timestamp = import.meta.env.VITE_APP_BUILD_TIMESTAMP ?? '' +const builtdate = import.meta.env.DEV ? dayjs() : dayjs(timestamp) +const repo = 'https://github.com/GZTimeWalker/GZCTF' + export const useConfig = () => { const { data: config, @@ -33,3 +40,47 @@ export const useConfig = () => { return { config: config ?? globalConfig, error, mutate } } + +const showBanner = () => { + const valid = + timestamp.length === 25 && builtdate.isValid() && sha.length === 40 && tag.length > 0 + const rst = '\x1b[0m' + const bold = '\x1b[1m' + const brand = '\x1b[38;2;4;202;171m' + const alert = '\x1b[38;2;254;48;48m' + const padding = ' '.repeat(45) + + const showtag = valid ? `${brand}${tag}` : `${alert}Unknown` + const commit = valid ? `${brand}${sha}` : `${alert}Unofficial build version` + + const title = ` + ██████╗ ███████╗ ${brand} ${rst} ██████╗████████╗███████╗ +██╔════╝ ╚══███╔╝ ${brand} ██╗██╗ ${rst} ██╔════╝╚══██╔══╝██╔════╝ +██║ ███╗ ███╔╝ ${brand} ╚═╝╚═╝ ${rst} ██║ ██║ █████╗ +██║ ██║ ███╔╝ ${brand} ██╗██╗ ${rst} ██║ ██║ ██╔══╝ +╚██████╔╝███████╗ ${brand} ╚═╝╚═╝ ${rst} ╚██████╗ ██║ ██║ + ╚═════╝ ╚══════╝ ${brand} ${rst} ╚═════╝ ╚═╝ ╚═╝ + +${padding}${bold}@ ${showtag}${rst} +` + + console.log( + `${title}` + + `\n${bold}Copyright (C) 2022-now, GZTimeWalker, All rights reserved.${rst}\n` + + `\n${bold}License : ${brand}GNU Affero General Public License v3.0${rst}` + + `\n${bold}Commit : ${commit}${rst}` + + `\n${bold}Built at : ${brand}${builtdate.format('YYYY-MM-DDTHH:mm:ssZ')}${rst}` + + `\n${bold}Issues : ${repo}/issues` + + '\n' + ) +} + +export const useBanner = () => { + const mounted = useRef(false) + useEffect(() => { + if (!mounted.current) { + showBanner() + mounted.current = true + } + }, []) +}