chore: better launch process

Author: ResetPower

.github/workflows/release.yml

@@ -17,6 +17,14 @@ jobs:
       - uses: actions/setup-node@v1
         with:
           node-version: "16"
+      - name: Install Apple Arch
+        uses: actions-rs/toolchain@v1
+        if: matrix.os == 'macos-latest'
+        with:
+          toolchain: stable
+          override: true
+          target: aarch64-apple-darwin
+          components: rustfmt, clippy
       - name: Cache node modules
         uses: actions/cache@v2
         env:

src/eph/components/ShadowText.tsx

@@ -0,0 +1,12 @@
+export default function ShadowText(props: { children: string }): JSX.Element {
+  return (
+    <div
+      className="text-white flex text-lg justify-end px-4"
+      style={{
+        textShadow: "0 0 2px black",
+      }}
+    >
+      {props.children}
+    </div>
+  );
+}

src/eph/views/HomePage.tsx

@@ -40,6 +40,7 @@ import { MinecraftAccount } from "common/struct/accounts";
 import { MinecraftProfile } from "common/struct/profiles";
 import { Canceller } from "common/task/cancel";
 import { BsServer } from "react-icons/bs";
+import ShadowText from "eph/components/ShadowText";
 
 export function RequestPasswordDialog(props: {
   again: boolean;
@@ -439,8 +440,11 @@ const HomePage = observer(() => {
           </MetroCardProvider>
         </div>
         {profile && value !== null ? (
-          <>
-            <div className="flex items-center justify-end m-3">
+          <div>
+            {homePageStore.isLaunching && (
+              <ShadowText>{homePageStore.launchingHelper}</ShadowText>
+            )}
+            <div className="flex items-center justify-end mx-3 mb-3">
               <Select
                 value={value}
                 options={_.map(profiles, (i, id) => ({
@@ -452,27 +456,27 @@ const HomePage = observer(() => {
                 className="overflow-ellipsis"
                 placementTop
               />
-              <Button
-                onClick={() => homePageStore.launch(account, profile)}
-                disabled={homePageStore.isLaunching}
-                variant="contained"
-                className="whitespace-nowrap"
-              >
-                {homePageStore.isLaunching
-                  ? homePageStore.launchingHelper
-                  : t("launch")}
-              </Button>
+              {homePageStore.isLaunching ? (
+                <Button
+                  onClick={homePageStore.cancel}
+                  variant="contained"
+                  className="whitespace-nowrap"
+                >
+                  {t("cancel")}
+                </Button>
+              ) : (
+                <Button
+                  onClick={() => homePageStore.launch(account, profile)}
+                  variant="contained"
+                  className="whitespace-nowrap"
+                >
+                  {t("launch")}
+                </Button>
+              )}
             </div>
-          </>
-        ) : (
-          <div
-            className="flex justify-end p-3 text-white"
-            style={{
-              textShadow: "0 0 2px black",
-            }}
-          >
-            {t("profile.notSelected")}
           </div>
+        ) : (
+          <ShadowText>{t("profile.notSelected")}</ShadowText>
         )}
       </div>
     </div>