Read full commit ~ 3.6.0

* Remove updater altogether due to Chrome's storage APIs being too slow to yield React. From now on, you will need to download the new Azalea version on every update. * Fix CSS for all UI * Fix Bookwork appearing inside of home tab after the completion of a homework * Fix entering pages and exiting pages by migrating the navigator function
acquitelol · Apr 17, 2024 · e7a7f77 · e7a7f77
1 parent ca6fef2
commit e7a7f77
Show file tree

Hide file tree

Showing 14 changed files with 61 additions and 489 deletions.
diff --git a/.github/workflows/build.yml b/.github/workflows/build.yml
@@ -29,19 +29,9 @@ jobs:
       - name: Prepare for release
         id: prepare
         run: |
-          rm $GITHUB_WORKSPACE/builds/* || true
-          mkdir builds || true
-          mv dist/bundle.js ./builds
-
           mv dist Azalea-${{ steps.version.outputs.value }}
           zip -r Azalea.zip Azalea-${{ steps.version.outputs.value }} & wait $!;
 
-          git config --local user.email "actions@github.com"
-          git config --local user.name "GitHub Actions"
-          git add builds
-          git commit -m "Build $GITHUB_SHA" || exit 0
-          git push
-
       - name: Create release
         uses: softprops/action-gh-release@v1
         with:

diff --git a/builds/bundle.js b/builds/bundle.js
diff --git a/extension/core.css b/extension/core.css
@@ -53,4 +53,42 @@ html {
     -webkit-text-fill-color: initial;
     background: var(--spx-button-contained-background-hover);
     color: var(--spx-button-contained-color-hover);
+}
+
+._AzaleaDropdown {
+    font-size: var(--spx-font-size-base);
+    -webkit-text-fill-color: initial;
+    color: var(--colours-text-body);
+    border-radius: var(--spx-radius-sm);
+    display: flex;
+    align-items: center;
+    padding: var(--spx-unit-2) var(--spx-unit-4);
+    position: relative;
+    -webkit-user-select: none;
+    -moz-user-select: none;
+    -ms-user-select: none;
+    user-select: none;
+    outline: none;
+}
+
+._AzaleaDropdown:hover {
+    background-color: var(--colours-nav-bar-hover);
+    cursor: pointer;
+}
+
+._AzaleaSelect {
+    background-color: var(--colours-plain-background);
+    width: 100%;
+    box-sizing: border-box;
+    border: 1px solid var(--colours-border);
+    -webkit-text-fill-color: initial;
+    color: var(--colours-text-body);
+    font-size: 100%;
+    height: var(--spx-unit-12);
+    padding: var(--spx-unit-2) var(--spx-unit-3);
+    border-radius: var(--spx-unit-1);
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    cursor: pointer;
 }
diff --git a/extension/manifest.json b/extension/manifest.json
@@ -1,6 +1,6 @@
 {
     "name": "Azalea",
-    "version": "3.5.8",
+    "version": "3.6.0",
     "description": "The cutest SparxMaths extension for Chromium ~!",
     "manifest_version": 3,
     "author": "Rosie",
@@ -17,9 +17,7 @@
     },
 
     "permissions": [
-        "declarativeNetRequestWithHostAccess",
-        "debugger",
-        "activeTab",
+        "declarativeNetRequest",
         "storage"
     ],
 
@@ -37,10 +35,6 @@
         }
     ],
 
-    "background": {
-        "service_worker": "worker.js"
-    },
-
     "externally_connectable": {
         "matches": [ "https://*.sparxmaths.uk/*", "https://sparxmaths.uk/*" ]
     },
@@ -49,7 +43,6 @@
         {
             "resources": [
                 "bundle.js",
-                "loader.js",
                 "cute.css",
                 "core.css"
             ],

diff --git a/rollup.config.ts b/rollup.config.ts
@@ -64,7 +64,7 @@ const defineExtendedConfig = ({ plugins, ...options }: RollupOptions) => defineC
 
 export default [
     defineExtendedConfig({
-        input: 'src/loader/index.ts',
+        input: 'src/index.ts',
 
         output: [
             {
@@ -85,18 +85,6 @@ export default [
             obfuscateCode()
         ]
     }),
-    defineExtendedConfig({
-        input: 'src/loader/worker.ts',
-
-        output: [
-            {
-                file: 'dist/worker.js',
-                format: 'iife',
-                inlineDynamicImports: true,
-                strict: false
-            }
-        ],
-    }),
     defineExtendedConfig({
         input: 'src/entry/index.ts',
 

diff --git a/src/core/components/buttons.tsx b/src/core/components/buttons.tsx
@@ -28,6 +28,6 @@ export function SolidButton({ style, ...props }: Arguments<typeof BaseButton>[0]
 export function DropdownButton(props: Arguments<typeof BaseButton>[0]) {
     return <BaseButton 
         {...props}
-        className={'_DropdownMenuItem_tgmt4_59' + ' ' + (props.className ?? '')}
+        className={'_AzaleaDropdown' + ' ' + (props.className ?? '')}
     />;
 }
diff --git a/src/core/components/section.tsx b/src/core/components/section.tsx
@@ -38,6 +38,7 @@ export function SectionBody({ children, style }: SectionBodyProps) {
 
 export function Section({ title, children, collapsable = true, style }: SectionProps) {
     const [hidden, setHidden] = React.useState(false);
+
     return <div style={mergeStyles({ marginInline: '2em' }, style)}>
         <div 
             style={commonStyles.merge(x => [

diff --git a/src/core/patches/bookworkBypass.tsx b/src/core/patches/bookworkBypass.tsx
@@ -91,8 +91,8 @@ function handler() {
     const codeMap = new Map<string, any>([['code', ''], ['answers', []]]);
 
     patcher.after('render', WAC.type, (_, { props: { children } }) => {
-        const topSection: any[] = findInReactTree(children, x => x?.find(y => y.props.className.includes('Bookwork')));
-        const bookworkSection = topSection?.find(x => x.props?.className?.includes('Bookwork'))?.props?.children;
+        const topSection: any[] = findInReactTree(children, x => x?.find(y => y.props?.className?.includes('Bookwork') && y.props?.shapeVariant === 'Boxy'));
+        const bookworkSection = topSection?.find(x => x.props?.className?.startsWith('Bookwork') && x.props?.shapeVariant === 'Boxy')?.props?.children;
         const firstOption = findInReactTree(children, x => x.props.choices && x.props.option);
 
         if (!bookworkSection) return;

diff --git a/src/core/patches/menu/settings/Settings.tsx b/src/core/patches/menu/settings/Settings.tsx
@@ -7,7 +7,6 @@ import About from './About';
 import Toggles from './Toggles';
 import Title from './Title';
 import Themes from './themes';
-import Updater from './Updater';
 
 const { React } = common;
 
@@ -29,10 +28,6 @@ function Settings() {
                 <Themes />
             </Section>
 
-            <Section title='Updater'>
-                <Updater />
-            </Section>
-
             <Section title='About'>
                 <About />
             </Section>

diff --git a/src/core/patches/menu/settings/Updater.tsx b/src/core/patches/menu/settings/Updater.tsx
diff --git a/src/core/patches/menu/settings/themes/SelectTheme.tsx b/src/core/patches/menu/settings/themes/SelectTheme.tsx
@@ -24,7 +24,7 @@ function SelectTheme({ label, selected, setSelected }: SelectThemeProps) {
 
     return <select 
         value={selected}
-        className='_SelectTrigger_g2nok_1'
+        className='_AzaleaSelect'
         style={styles.selector}
         onChange={e => {
             const index = Number(e.target.value);

diff --git a/src/core/utilities/navigate.ts b/src/core/utilities/navigate.ts
@@ -6,8 +6,12 @@
  */
 function navigate(
     path: string | number,
-    prefix = '/student'
+    prefix = ''
 ) {
+    if (typeof path === 'number') {
+        path = '/';
+    }
+
     azalea.navigation.navigator.replace(prefix ? `${prefix}${path}` : path);
 }
 

diff --git a/src/loader/index.ts → src/index.ts b/src/loader/index.ts → src/index.ts
@@ -1,9 +1,6 @@
-import { storages } from '@core/handlers/state';
 import logger from '@core/logger';
 import validate from '@entry/validate';
 
-const { updater } = storages;
-
 function loadElement<T extends Element>(element: T) {
     (document.body || document.head || document.documentElement).appendChild(element);
 }
@@ -19,27 +16,18 @@ function loadStylesheetFromURL(src: string, id = 'stylesheet') {
     loadElement(link);
 }
 
-loadStylesheetFromURL(chrome.runtime.getURL('core.css'), 'azalea-core-styles');
-loadStylesheetFromURL(chrome.runtime.getURL('cute.css'), 'azalea-theme-styles');
 
-logger.info('Loading Azalea...');
+async function loadFromURL(src, async = false) {
+    const script = document.createElement('script');
+    script.src = src;
+    script.async = async;
 
-validate(() => chrome.runtime.sendMessage({
-    type: 'inject-azalea',
+    loadElement(script);
+}
 
-    // Force update if the user chose to reset updates
-    update: updater.get('resetUpdates') || !updater.get('updaterDisabled'),
-    reset: updater.get('resetUpdates'),
-    local: updater.get('localFetch')
-}));
+loadStylesheetFromURL(chrome.runtime.getURL('core.css'), 'azalea-core-styles');
+loadStylesheetFromURL(chrome.runtime.getURL('cute.css'), 'azalea-theme-styles');
 
-if (updater.get('resetUpdates')) {
-    updater.set('resetUpdates', false);
-}
+logger.info('Loading Azalea...');
 
-if (updater.get('localFetch')) {
-    fetch(chrome.runtime.getURL('bundle.js')).catch(() => {
-        updater.set('localFetch', false);
-        location.reload();
-    });
-}
+validate(() => loadFromURL(chrome.runtime.getURL('bundle.js')));