Refractor plugin backend (#111)

* refractor uninstall plugin backend

* refractor plugin installation method

* Change formatting in browser.py

* Manually format main.py

* Manually format utilities.py

* remove inconsistency

* remove unnecessary linebreaks

* lol what

* last minute pythoning

* Fix async missing

* lint

* more refractor

* await forgotten

* fix: menu not disappearing after first click

* lint

* bug: fix double click on uninstall

* depricate request installs

* basic patch notes viewer, lazy-load settings and store, build frontend as esmodule, add lazy-loaded react-markdown, backend changes to accomodate ESModule frontend

* refractor uninstall plugin backend

* Change formatting in browser.py

* Manually format main.py

* Manually format utilities.py

* remove unnecessary linebreaks

* lol what

* last minute pythoning

* Fix async missing

* rebase onto main

* fix error, fix React crash if patch notes are opened before remote version info is loaded

Co-authored-by: TrainDoctor <traindoctor@protonmail.com>
Co-authored-by: AAGaming <aa@mail.catvibers.me>

frontend/src/components/settings/pages/general/Updater.tsx

@@ -17,46 +17,38 @@ function PatchNotesModal({ versionInfo, closeModal }: { versionInfo: VerInfo | n
   return (
     <Focusable onCancelButton={closeModal}>
       <Carousel
-        fnItemRenderer={(id: number, ...args: any[]) => {
-          console.log(args, versionInfo);
-          return (
-            <Focusable
-              onActivate={() => {}}
-              style={{
-                marginTop: '40px',
-                height: 'calc( 100% - 40px )',
-                overflowY: 'scroll',
-                display: 'flex',
-                justifyContent: 'center',
-                margin: '40px',
-              }}
-            >
-              <div>
-                <h1>{versionInfo?.all?.[id]?.name}</h1>
-                {versionInfo?.all?.[id]?.body ? (
-                  <Suspense fallback={<Spinner style={{ width: '24', height: '24' }} />}>
-                    <MarkdownRenderer>{versionInfo.all[id].body}</MarkdownRenderer>
-                  </Suspense>
-                ) : (
-                  'no patch notes for this version'
-                )}
-              </div>
-            </Focusable>
-          );
-        }}
-        fnGetId={(id) => {
-          return id;
-        }}
+        fnItemRenderer={(id: number) => (
+          <Focusable
+            onActivate={() => {}}
+            style={{
+              marginTop: '40px',
+              height: 'calc( 100% - 40px )',
+              overflowY: 'scroll',
+              display: 'flex',
+              justifyContent: 'center',
+              margin: '40px',
+            }}
+          >
+            <div>
+              <h1>{versionInfo?.all?.[id]?.name}</h1>
+              {versionInfo?.all?.[id]?.body ? (
+                <Suspense fallback={<Spinner style={{ width: '24', height: '24' }} />}>
+                  <MarkdownRenderer>{versionInfo.all[id].body}</MarkdownRenderer>
+                </Suspense>
+              ) : (
+                'no patch notes for this version'
+              )}
+            </div>
+          </Focusable>
+        )}
+        fnGetId={(id) => id}
         nNumItems={versionInfo?.all?.length}
         nHeight={window.innerHeight - 150}
         nItemHeight={window.innerHeight - 200}
         nItemMarginX={0}
         initialColumn={0}
         autoFocus={true}
-        fnGetColumnWidth={(...args: any[]) => {
-          console.log('cw', args);
-          return window.innerWidth;
-        }}
+        fnGetColumnWidth={() => window.innerWidth}
       />
     </Focusable>
   );
@@ -98,8 +90,8 @@ export default function UpdaterSettings() {
   return (
     <>
       <Field
-        onOptionsActionDescription="Patch Notes"
-        onOptionsButton={showPatchNotes}
+        onOptionsActionDescription={versionInfo?.all ? 'Patch Notes' : undefined}
+        onOptionsButton={versionInfo?.all ? showPatchNotes : undefined}
         label="Updates"
         description={
           versionInfo && (

frontend/src/plugin-loader.tsx

@@ -150,16 +150,7 @@ class PluginLoader extends Logger {
     showModal(
       <ModalRoot
         onOK={async () => {
-          const formData = new FormData();
-          formData.append('name', name);
-          await fetch('http://localhost:1337/browser/uninstall_plugin', {
-            method: 'POST',
-            body: formData,
-            credentials: 'include',
-            headers: {
-              Authentication: window.deckyAuthToken,
-            },
-          });
+          await this.callServerMethod('uninstall_plugin', { name });
         }}
         onCancel={() => {
           // do nothing

frontend/src/store.tsx

@@ -42,17 +42,10 @@ export function getLegacyPluginList(): Promise<LegacyStorePlugin[]> {
 }
 
 export async function installFromURL(url: string) {
-  const formData = new FormData();
   const splitURL = url.split('/');
-  formData.append('name', splitURL[splitURL.length - 1].replace('.zip', ''));
-  formData.append('artifact', url);
-  await fetch('http://localhost:1337/browser/install_plugin', {
-    method: 'POST',
-    body: formData,
-    credentials: 'include',
-    headers: {
-      Authentication: window.deckyAuthToken,
-    },
+  await window.DeckyPluginLoader.callServerMethod('install_plugin', {
+    name: splitURL[splitURL.length - 1].replace('.zip', ''),
+    artifact: url,
   });
 }
 
@@ -60,18 +53,11 @@ export function requestLegacyPluginInstall(plugin: LegacyStorePlugin, selectedVe
   showModal(
     <ModalRoot
       onOK={() => {
-        const formData = new FormData();
-        formData.append('name', plugin.artifact);
-        formData.append('artifact', `https://github.com/${plugin.artifact}/archive/refs/tags/${selectedVer}.zip`);
-        formData.append('version', selectedVer);
-        formData.append('hash', plugin.versions[selectedVer]);
-        fetch('http://localhost:1337/browser/install_plugin', {
-          method: 'POST',
-          body: formData,
-          credentials: 'include',
-          headers: {
-            Authentication: window.deckyAuthToken,
-          },
+        window.DeckyPluginLoader.callServerMethod('install_plugin', {
+          name: plugin.artifact,
+          artifact: `https://github.com/${plugin.artifact}/archive/refs/tags/${selectedVer}.zip`,
+          version: selectedVer,
+          hash: plugin.versions[selectedVer],
         });
       }}
       onCancel={() => {
@@ -89,18 +75,11 @@ export function requestLegacyPluginInstall(plugin: LegacyStorePlugin, selectedVe
 }
 
 export async function requestPluginInstall(plugin: string, selectedVer: StorePluginVersion) {
-  const formData = new FormData();
-  formData.append('name', plugin);
-  formData.append('artifact', `https://cdn.tzatzikiweeb.moe/file/steam-deck-homebrew/versions/${selectedVer.hash}.zip`);
-  formData.append('version', selectedVer.name);
-  formData.append('hash', selectedVer.hash);
-  await fetch('http://localhost:1337/browser/install_plugin', {
-    method: 'POST',
-    body: formData,
-    credentials: 'include',
-    headers: {
-      Authentication: window.deckyAuthToken,
-    },
+  await window.DeckyPluginLoader.callServerMethod('install_plugin', {
+    name: plugin,
+    artifact: `https://cdn.tzatzikiweeb.moe/file/steam-deck-homebrew/versions/${selectedVer.hash}.zip`,
+    version: selectedVer.name,
+    hash: selectedVer.hash,
   });
 }