diff --git a/interface/.eslintrc.cjs b/interface/.eslintrc.cjs deleted file mode 100644 index d6c95379..00000000 --- a/interface/.eslintrc.cjs +++ /dev/null @@ -1,18 +0,0 @@ -module.exports = { - root: true, - env: { browser: true, es2020: true }, - extends: [ - 'eslint:recommended', - 'plugin:@typescript-eslint/recommended', - 'plugin:react-hooks/recommended', - ], - ignorePatterns: ['dist', '.eslintrc.cjs'], - parser: '@typescript-eslint/parser', - plugins: ['react-refresh'], - rules: { - 'react-refresh/only-export-components': [ - 'warn', - { allowConstantExport: true }, - ], - }, -} diff --git a/interface/.gitignore b/interface/.gitignore deleted file mode 100644 index a547bf36..00000000 --- a/interface/.gitignore +++ /dev/null @@ -1,24 +0,0 @@ -# Logs -logs -*.log -npm-debug.log* -yarn-debug.log* -yarn-error.log* -pnpm-debug.log* -lerna-debug.log* - -node_modules -dist -dist-ssr -*.local - -# Editor directories and files -.vscode/* -!.vscode/extensions.json -.idea -.DS_Store -*.suo -*.ntvs* -*.njsproj -*.sln -*.sw? diff --git a/interface/README.md b/interface/README.md deleted file mode 100644 index 1ebe379f..00000000 --- a/interface/README.md +++ /dev/null @@ -1,27 +0,0 @@ -# React + TypeScript + Vite - -This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules. - -Currently, two official plugins are available: - -- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh -- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh - -## Expanding the ESLint configuration - -If you are developing a production application, we recommend updating the configuration to enable type aware lint rules: - -- Configure the top-level `parserOptions` property like this: - -```js - parserOptions: { - ecmaVersion: 'latest', - sourceType: 'module', - project: ['./tsconfig.json', './tsconfig.node.json'], - tsconfigRootDir: __dirname, - }, -``` - -- Replace `plugin:@typescript-eslint/recommended` to `plugin:@typescript-eslint/recommended-type-checked` or `plugin:@typescript-eslint/strict-type-checked` -- Optionally add `plugin:@typescript-eslint/stylistic-type-checked` -- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and add `plugin:react/recommended` & `plugin:react/jsx-runtime` to the `extends` list diff --git a/interface/bun.lockb b/interface/bun.lockb deleted file mode 100755 index b124928d..00000000 Binary files a/interface/bun.lockb and /dev/null differ diff --git a/interface/index.html b/interface/index.html deleted file mode 100644 index feec9812..00000000 --- a/interface/index.html +++ /dev/null @@ -1,13 +0,0 @@ - - - - - - - Vite + React + TS - - -
- - - diff --git a/interface/package.json b/interface/package.json deleted file mode 100644 index 9800ac8a..00000000 --- a/interface/package.json +++ /dev/null @@ -1,33 +0,0 @@ -{ - "name": "popup", - "private": true, - "version": "0.0.0", - "type": "module", - "scripts": { - "dev": "vite", - "build": "tsc && vite build", - "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0", - "preview": "vite preview" - }, - "dependencies": { - "framer-motion": "^10.16.4", - "react": "^18.2.0", - "react-best-gradient-color-picker": "^2.2.22", - "react-dom": "^18.2.0" - }, - "devDependencies": { - "@types/react": "^18.2.15", - "@types/react-dom": "^18.2.7", - "@typescript-eslint/eslint-plugin": "^6.0.0", - "@typescript-eslint/parser": "^6.0.0", - "@vitejs/plugin-react": "^4.0.3", - "autoprefixer": "^10.4.15", - "eslint": "^8.45.0", - "eslint-plugin-react-hooks": "^4.6.0", - "eslint-plugin-react-refresh": "^0.4.3", - "postcss": "^8.4.29", - "tailwindcss": "^3.3.3", - "typescript": "^5.0.2", - "vite": "^4.4.5" - } -} diff --git a/interface/postcss.config.js b/interface/postcss.config.js deleted file mode 100644 index 2e7af2b7..00000000 --- a/interface/postcss.config.js +++ /dev/null @@ -1,6 +0,0 @@ -export default { - plugins: { - tailwindcss: {}, - autoprefixer: {}, - }, -} diff --git a/interface/public/vite.svg b/interface/public/vite.svg deleted file mode 100644 index e7b8dfb1..00000000 --- a/interface/public/vite.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/interface/src/App.css b/interface/src/App.css deleted file mode 100644 index e69de29b..00000000 diff --git a/interface/src/App.tsx b/interface/src/App.tsx deleted file mode 100644 index b0b4872e..00000000 --- a/interface/src/App.tsx +++ /dev/null @@ -1,75 +0,0 @@ -// App.tsx -import { useState } from 'react'; -import TabbedContainer from './components/TabbedContainer'; -import Settings from './pages/Settings'; -import logo from './assets/betterseqta-dark-full.png'; -import logoDark from './assets/betterseqta-light-full.png'; -import Shortcuts from './pages/Shortcuts'; -import About from './pages/About'; - -export interface SettingsState { - notificationCollector: boolean; - lessonAlerts: boolean; - animatedBackground: boolean; - animatedBackgroundSpeed: boolean; - customThemeColor: string; - betterSEQTAPlus: boolean; -} - -const App: React.FC = () => { - const [settingsState, setSettingsState] = useState({ - notificationCollector: false, - lessonAlerts: false, - animatedBackground: false, - animatedBackgroundSpeed: false, - customThemeColor: "#db6969", - betterSEQTAPlus: true - }); - - // Handler for Switches - const switchChange = (key: string, isOn: boolean) => { - setSettingsState({ - ...settingsState, - [key]: isOn, - }); - }; - - // Handler for ColorPicker - const colorChange = (color: string) => { - setSettingsState({ - ...settingsState, - customThemeColor: color, - }); - }; - - const tabs = [ - { - title: 'Settings', - content: - }, - { - title: 'Shortcuts', - content: - }, - { - title: 'About', - content: - } - ]; - - return ( -
- -
-
- - -
- -
- -
- ); -} - -export default App; \ No newline at end of file diff --git a/interface/src/assets/betterseqta-dark-full.png b/interface/src/assets/betterseqta-dark-full.png deleted file mode 100644 index f2c77f49..00000000 Binary files a/interface/src/assets/betterseqta-dark-full.png and /dev/null differ diff --git a/interface/src/assets/betterseqta-light-full.png b/interface/src/assets/betterseqta-light-full.png deleted file mode 100644 index 6bd12477..00000000 Binary files a/interface/src/assets/betterseqta-light-full.png and /dev/null differ diff --git a/interface/src/assets/react.svg b/interface/src/assets/react.svg deleted file mode 100644 index 6c87de9b..00000000 --- a/interface/src/assets/react.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/interface/src/components/ColorPicker.tsx b/interface/src/components/ColorPicker.tsx deleted file mode 100644 index 84bd298d..00000000 --- a/interface/src/components/ColorPicker.tsx +++ /dev/null @@ -1,45 +0,0 @@ -// TODO: Create types for ColorPicker -// @ts-expect-error No typescript declarations available -import ColorPicker from 'react-best-gradient-color-picker'; -import { useState, useRef, useEffect } from 'react'; - -interface ColorPickerProps { - color: string; - onChange: (color: string) => void; -} - -const Picker = ({ color, onChange }: ColorPickerProps) => { - const [showPicker, setShowPicker] = useState(false); - const ref = useRef(null); - - useEffect(() => { - const handleClickOutside = (event: MouseEvent): void => { - if (ref.current && !ref.current.contains(event.target as Node)) { - setShowPicker(false); - } - }; - if (showPicker) { - document.addEventListener('mousedown', handleClickOutside); - } - return () => { - document.removeEventListener('mousedown', handleClickOutside); - }; - }, [showPicker]); - - return ( -
- - {showPicker && ( -
- -
- )} -
- ); -}; - -export default Picker; diff --git a/interface/src/components/Slider.css b/interface/src/components/Slider.css deleted file mode 100644 index ee7b1c0b..00000000 --- a/interface/src/components/Slider.css +++ /dev/null @@ -1,21 +0,0 @@ -.range-slider{ - margin: 20px; - appearance: none; - outline: none; - width: 150px; - height: 3px; - border-radius: 5px; - background-color: #ccc; -} - -.range-slide::-webkit-slider-runnable-track{ - background-color: #4BD663 !important; -} -.range-slider::-webkit-slider-thumb { - background: #fafafa; - appearance: none; - box-shadow: 1px 2px 26px 1px #bdbdbd; - width: 15px; - height: 15px; - border-radius: 50%; -} \ No newline at end of file diff --git a/interface/src/components/Slider.tsx b/interface/src/components/Slider.tsx deleted file mode 100644 index 664d357d..00000000 --- a/interface/src/components/Slider.tsx +++ /dev/null @@ -1,35 +0,0 @@ -import React, { useState } from 'react'; -import "./Slider.css"; - -interface Slider { - onValueChange: (value: number) => void; -} - -const Slider: React.FC = ({ onValueChange }) => { - const [sliderValue, setSliderValue] = useState(0); - - const handleInputChange = (event: React.ChangeEvent) => { - const value = parseInt(event.target.value, 10); - setSliderValue(value); - }; - - const handleMouseUp = () => { - onValueChange(sliderValue); - }; - - return ( -
- -
- ); -}; - -export default Slider; \ No newline at end of file diff --git a/interface/src/components/Switch.css b/interface/src/components/Switch.css deleted file mode 100644 index d7e84449..00000000 --- a/interface/src/components/Switch.css +++ /dev/null @@ -1,3 +0,0 @@ -.switch[data-ison="true"] { - background-color: #30D259; -} \ No newline at end of file diff --git a/interface/src/components/Switch.tsx b/interface/src/components/Switch.tsx deleted file mode 100644 index 62dacfec..00000000 --- a/interface/src/components/Switch.tsx +++ /dev/null @@ -1,36 +0,0 @@ -import { motion } from "framer-motion"; -import "./Switch.css"; - -interface SwitchProps { - onChange: (isOn: boolean) => void; - state: boolean; -} - -export default function Switch(props: SwitchProps) { - const toggleSwitch = () => { - const newIsOn = !props.state; - props.onChange(newIsOn); - }; - - return ( -
- -
- ); -} - -const spring = { - type: "spring", - stiffness: 700, - damping: 30 -}; \ No newline at end of file diff --git a/interface/src/components/TabbedContainer.tsx b/interface/src/components/TabbedContainer.tsx deleted file mode 100644 index 91df24dd..00000000 --- a/interface/src/components/TabbedContainer.tsx +++ /dev/null @@ -1,92 +0,0 @@ -import React, { useState, useRef, useEffect } from 'react'; -import { motion } from 'framer-motion'; - -interface Tab { - title: string; - content: JSX.Element; -} - -interface TabbedContainerProps { - tabs: Tab[]; - themeColor: string; -} - -const TabbedContainer: React.FC = ({ tabs, themeColor }) => { - const [activeTab, setActiveTab] = useState(0); - const [hoveredTab, setHoveredTab] = useState(null); - const [tabWidth, setTabWidth] = useState(0); - const [position, setPosition] = useState(0); - const positionRef = useRef(position); - - useEffect(() => { - const newPosition = -activeTab * 100; - setPosition(newPosition); - positionRef.current = newPosition; - }, [activeTab]); - - const containerRef = useRef(null); - - const springTransition = { type: 'spring', stiffness: 250, damping: 25 }; - - useEffect(() => { - if (containerRef.current) { - // @ts-expect-error for some reason its giving an error in TS but it works... - const width = containerRef.current.getBoundingClientRect().width; - setTabWidth(width / tabs.length); - } - }, [tabs.length]); - - const calcXPos = (index: number | null) => { - if (index !== null) { - return tabWidth * index; - } - return tabWidth * activeTab; - }; - - return ( -
-
-
- - {tabs.map((tab, index) => ( - - ))} -
-
-
- -
- {tabs.map((tab, index) => ( -
- {tab.content} -
- ))} -
- -
-
- ); -}; - -export default TabbedContainer; diff --git a/interface/src/index.css b/interface/src/index.css deleted file mode 100644 index b2d789e1..00000000 --- a/interface/src/index.css +++ /dev/null @@ -1,13 +0,0 @@ -@tailwind base; -@tailwind components; -@tailwind utilities; - -:root { - font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif; - - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -webkit-text-size-adjust: 100%; -} \ No newline at end of file diff --git a/interface/src/main.tsx b/interface/src/main.tsx deleted file mode 100644 index c750850e..00000000 --- a/interface/src/main.tsx +++ /dev/null @@ -1,10 +0,0 @@ -import React from 'react' -import ReactDOM from 'react-dom/client' -import App from './App.tsx' -import './index.css' - -ReactDOM.createRoot(document.getElementById('ExtensionPopup')!).render( - - - , -) diff --git a/interface/src/pages/About.tsx b/interface/src/pages/About.tsx deleted file mode 100644 index 53197a2a..00000000 --- a/interface/src/pages/About.tsx +++ /dev/null @@ -1,10 +0,0 @@ -const About: React.FC = () => { - - return ( -
-

About

-
- ); -}; - -export default About; diff --git a/interface/src/pages/Settings.tsx b/interface/src/pages/Settings.tsx deleted file mode 100644 index 71a13851..00000000 --- a/interface/src/pages/Settings.tsx +++ /dev/null @@ -1,68 +0,0 @@ -import Switch from '../components/Switch'; -import ColorPicker from '../components/ColorPicker'; -import { SettingsState } from '../App'; - -interface ISetting { - title: string; - description: string; - modifyElement: JSX.Element; -} - -interface SettingsProps { - settingsState: SettingsState; - switchChange: (key: string, isOn: boolean) => void; - colorChange: (color: string) => void; -} - -const Settings: React.FC = ({ settingsState, switchChange, colorChange }) => { - const settings: ISetting[] = [ - { - title: "Notification Collector", - description: "Uncaps the 9+ limit for notifications, showing the real number.", - modifyElement: switchChange('notificationCollector', isOn)} /> - }, - { - title: "Lesson Alerts", - description: "Sends a native browser notification ~5 minutes prior to lessons.", - modifyElement: switchChange('lessonAlerts', isOn)} /> - }, - { - title: "Animated Background", - description: "Adds an animated background to BetterSEQTA. (May impact battery life)", - modifyElement: switchChange('animatedBackground', isOn)} /> - }, - { - title: "Animated Background Speed", - description: "Controls the speed of the animated background.", - modifyElement: switchChange('animatedBackgroundSpeed', isOn)} /> - }, - { - title: "Custom Theme Colour", - description: "Customise the overall theme colour of SEQTA Learn.", - modifyElement: colorChange(color)} /> - }, - { - title: "BetterSEQTA+", - description: "Unlocks premium features.", - modifyElement: switchChange('betterSEQTAPlus', isOn)} /> - } - ]; - - return ( -
- {settings.map((setting, index) => ( -
-
-

{setting.title}

-

{setting.description}

-
-
- {setting.modifyElement} -
-
- ))} -
- ); -}; - -export default Settings; diff --git a/interface/src/pages/Shortcuts.tsx b/interface/src/pages/Shortcuts.tsx deleted file mode 100644 index 7400df6a..00000000 --- a/interface/src/pages/Shortcuts.tsx +++ /dev/null @@ -1,95 +0,0 @@ -import { useState } from "react"; -import Switch from "../components/Switch"; - -export default function Shortcuts() { - const [shortcutState, setShortcutState] = useState({ - youtube: false, - outlook: false, - office: false, - spotify: false, - google: false, - duckduckgo: false, - coolmathgames: false, - sace: false, - googlescholar: false, - gmail: false, - netflix: false - }); - - // Handler for Switches - const switchChange = (key: string, isOn: boolean) => { - setShortcutState({ - ...shortcutState, - [key]: isOn, - }); - }; - - const DefaultShortcuts = [ - { - title: "YouTube", - link: "https://youtube.com", - modifyElement: switchChange('youtube', isOn)} /> - }, - { - title: "Outlook", - link: "https://outlook.office.com/mail/inbox", - modifyElement: switchChange('outlook', isOn)} /> - }, - { - title: "Office", - link: "https://www.office.com/", - modifyElement: switchChange('office', isOn)} /> - }, - { - title: "Spotify", - link: "https://www.spotify.com/", - modifyElement: switchChange('spotify', isOn)} /> - }, - { - title: "Google", - link: "https://www.google.com/", - modifyElement: switchChange('google', isOn)} /> - }, - { - title: "DuckDuckGo", - link: "https://duckduckgo.com/", - modifyElement: switchChange('duckduckgo', isOn)} /> - }, - { - title: "Cool Math Games", - link: "https://www.coolmathgames.com/", - modifyElement: switchChange('coolmathgames', isOn)} /> - }, - { - title: "SACE", - link: "https://www.sace.sa.edu.au/", - modifyElement: switchChange('sace', isOn)} /> - }, - { - title: "Google Scholar", - link: "https://scholar.google.com/", - modifyElement: switchChange('googlescholar', isOn)} /> - }, - { - title: "Gmail", - link: "https://mail.google.com/", - modifyElement: switchChange('gmail', isOn)} /> - }, - { - title: "Netflix", - link: "https://www.netflix.com/", - modifyElement: switchChange('netflix', isOn)} /> - } - ]; - - return ( -
- {DefaultShortcuts.map((shortcut, index) => ( -
- {shortcut.title} - {shortcut.modifyElement} -
- ))} -
- ); -} diff --git a/interface/src/vite-env.d.ts b/interface/src/vite-env.d.ts deleted file mode 100644 index 11f02fe2..00000000 --- a/interface/src/vite-env.d.ts +++ /dev/null @@ -1 +0,0 @@ -/// diff --git a/interface/tailwind.config.js b/interface/tailwind.config.js deleted file mode 100644 index 1cc7babf..00000000 --- a/interface/tailwind.config.js +++ /dev/null @@ -1,22 +0,0 @@ -/** @type {import('tailwindcss').Config} */ -export default { - content: [ - "./index.html", - "./src/**/*.{js,ts,jsx,tsx}", - ], - darkMode: "class", - theme: { - fontSize: { - 'xs': '.65rem', - 'sm': '.775rem', - 'base': '0.65rem', // 16px - 'md': '0.65rem', // 16px - 'lg': '1rem', // 18px - 'xl': '1.25rem', // 20px - '2xl': '1.5rem', // 24px - '3xl': '1.875rem', // 30px - } - }, - plugins: [], -} - diff --git a/interface/tsconfig.json b/interface/tsconfig.json deleted file mode 100644 index a7fc6fbf..00000000 --- a/interface/tsconfig.json +++ /dev/null @@ -1,25 +0,0 @@ -{ - "compilerOptions": { - "target": "ES2020", - "useDefineForClassFields": true, - "lib": ["ES2020", "DOM", "DOM.Iterable"], - "module": "ESNext", - "skipLibCheck": true, - - /* Bundler mode */ - "moduleResolution": "bundler", - "allowImportingTsExtensions": true, - "resolveJsonModule": true, - "isolatedModules": true, - "noEmit": true, - "jsx": "react-jsx", - - /* Linting */ - "strict": true, - "noUnusedLocals": true, - "noUnusedParameters": true, - "noFallthroughCasesInSwitch": true - }, - "include": ["src"], - "references": [{ "path": "./tsconfig.node.json" }] -} diff --git a/interface/tsconfig.node.json b/interface/tsconfig.node.json deleted file mode 100644 index 42872c59..00000000 --- a/interface/tsconfig.node.json +++ /dev/null @@ -1,10 +0,0 @@ -{ - "compilerOptions": { - "composite": true, - "skipLibCheck": true, - "module": "ESNext", - "moduleResolution": "bundler", - "allowSyntheticDefaultImports": true - }, - "include": ["vite.config.ts"] -} diff --git a/interface/vite.config.ts b/interface/vite.config.ts deleted file mode 100644 index 6c98fca4..00000000 --- a/interface/vite.config.ts +++ /dev/null @@ -1,17 +0,0 @@ -import { defineConfig } from 'vite' -import react from '@vitejs/plugin-react' - -// https://vitejs.dev/config/ -export default defineConfig({ - plugins: [react()], - build: { - //outDir: '../../public/popup-dist', - rollupOptions: { - output: { - assetFileNames: 'client/rsc/[ext]/[name][extname]', - chunkFileNames: 'client/rsc/[chunks]/[name].[hash].js', - entryFileNames: 'client/rsc/js/client.js' - } - } - } -})