Show warning when installing legacy pluginsv2.0.4-6e88c7c-pre

1 files changed, 27 insertions, 11 deletions

diff --git a/frontend/src/components/store/Store.tsx b/frontend/src/components/store/Store.tsx
index 01cf383d..ffad5426 100644
--- a/frontend/src/components/store/Store.tsx
+++ b/frontend/src/components/store/Store.tsx
@@ -1,4 +1,4 @@
-import { SteamSpinner } from 'decky-frontend-lib';
+import { ModalRoot, SteamSpinner, showModal, staticClasses } from 'decky-frontend-lib';
 import { FC, useEffect, useState } from 'react';
 
 import PluginCard from './PluginCard';
@@ -38,16 +38,32 @@ export async function installFromURL(url: string) {
   });
 }
 
-export async function requestLegacyPluginInstall(plugin: LegacyStorePlugin, selectedVer: string) {
-  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]);
-  await fetch('http://localhost:1337/browser/install_plugin', {
-    method: 'POST',
-    body: formData,
-  });
+export function requestLegacyPluginInstall(plugin: LegacyStorePlugin, selectedVer: string) {
+  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,
+        });
+      }}
+      onCancel={() => {
+        // do nothing
+      }}
+    >
+      <div className={staticClasses.Title} style={{ flexDirection: 'column' }}>
+        Using legacy plugins
+      </div>
+      You are currently installing a <b>legacy</b> plugin. Legacy plugins are no longer supported and may have issues.
+      Legacy plugins do not support gamepad input. To interact with a legacy plugin, you will need to use the
+      touchscreen.
+    </ModalRoot>,
+  );
 }
 
 export async function requestPluginInstall(plugin: StorePlugin, selectedVer: StorePluginVersion) {