From 9e8bad00840d3c948fe531817c8f539b468f3431 Mon Sep 17 00:00:00 2001
From: undergroundwires <git@undergroundwires.dev>
Date: Mon, 14 Oct 2024 13:03:44 +0200
Subject: [PATCH] Fix browser instructions appearing on desktop

Previously, the app showed browser download/run instructions on the
desktop version, which was irrelevant for desktop users. This change
improves the user experience by displaying these instructions only
in browser environments.

This change streamlines the script saving process for desktop users
while maintaining the necessary guidance for browser users.

The commit:

- Prevents the instruction modal from appearing on desktop
- Renames components for clarity (e.g., 'RunInstructions' to
  'BrowserRunInstructions')
- Adds a check to ensure browser environment before showing
  instructions
---
 .../BrowserRunInstructions.vue}                     |  9 +++++++++
 .../Help/InfoTooltipInline.vue                      |  0
 .../Help/InfoTooltipWrapper.vue                     |  0
 .../Steps/CopyableCommand.vue                       |  0
 .../Steps/InstructionStep.vue                       |  0
 .../Steps/InstructionSteps.vue                      |  0
 .../Steps/PlatformInstructionSteps.vue              |  0
 .../Steps/Platforms/LinuxInstructions.vue           |  0
 .../Steps/Platforms/MacOsInstructions.vue           |  0
 .../Steps/Platforms/WindowsInstructions.vue         |  0
 .../Code/CodeButtons/Save/CodeSaveButton.vue        | 13 +++++++++----
 .../RunInstructions/Steps/CopyableCommand.spec.ts   |  2 +-
 .../Steps/PlatformInstructionSteps.spec.ts          |  8 ++++----
 13 files changed, 23 insertions(+), 9 deletions(-)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions/RunInstructions.vue => BrowserRunInstructions/BrowserRunInstructions.vue} (88%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Help/InfoTooltipInline.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Help/InfoTooltipWrapper.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Steps/CopyableCommand.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Steps/InstructionStep.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Steps/InstructionSteps.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Steps/PlatformInstructionSteps.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Steps/Platforms/LinuxInstructions.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Steps/Platforms/MacOsInstructions.vue (100%)
 rename src/presentation/components/Code/CodeButtons/Save/{RunInstructions => BrowserRunInstructions}/Steps/Platforms/WindowsInstructions.vue (100%)

diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/RunInstructions.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/BrowserRunInstructions.vue
similarity index 88%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/RunInstructions.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/BrowserRunInstructions.vue
index 8ab15a672..b6d025a18 100644
--- a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/RunInstructions.vue
+++ b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/BrowserRunInstructions.vue
@@ -47,6 +47,8 @@ export default defineComponent({
     },
   },
   setup() {
+    ensureBrowserEnvironment();
+
     const { currentState } = injectKey((keys) => keys.useCollectionState);
 
     const { projectDetails } = injectKey((keys) => keys.useApplication);
@@ -70,6 +72,13 @@ export default defineComponent({
     };
   },
 });
+
+function ensureBrowserEnvironment(): void {
+  const { isRunningAsDesktopApplication } = injectKey((keys) => keys.useRuntimeEnvironment);
+  if (isRunningAsDesktopApplication) {
+    throw new Error('Not applicable in desktop environments');
+  }
+}
 </script>
 
 <style scoped lang="scss">
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Help/InfoTooltipInline.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Help/InfoTooltipInline.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Help/InfoTooltipInline.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Help/InfoTooltipInline.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Help/InfoTooltipWrapper.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Help/InfoTooltipWrapper.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Help/InfoTooltipWrapper.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Help/InfoTooltipWrapper.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/CopyableCommand.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/CopyableCommand.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/InstructionStep.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/InstructionStep.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/InstructionStep.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/InstructionStep.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/InstructionSteps.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/InstructionSteps.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/InstructionSteps.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/InstructionSteps.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/PlatformInstructionSteps.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/PlatformInstructionSteps.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/PlatformInstructionSteps.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/PlatformInstructionSteps.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/LinuxInstructions.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/LinuxInstructions.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/LinuxInstructions.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/LinuxInstructions.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/MacOsInstructions.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/MacOsInstructions.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/MacOsInstructions.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/MacOsInstructions.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/WindowsInstructions.vue b/src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/WindowsInstructions.vue
similarity index 100%
rename from src/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/WindowsInstructions.vue
rename to src/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/WindowsInstructions.vue
diff --git a/src/presentation/components/Code/CodeButtons/Save/CodeSaveButton.vue b/src/presentation/components/Code/CodeButtons/Save/CodeSaveButton.vue
index 405af3158..b5237bd3b 100644
--- a/src/presentation/components/Code/CodeButtons/Save/CodeSaveButton.vue
+++ b/src/presentation/components/Code/CodeButtons/Save/CodeSaveButton.vue
@@ -6,7 +6,7 @@
       @click="saveCode"
     />
     <ModalDialog v-model="areInstructionsVisible">
-      <RunInstructions :filename="filename" />
+      <BrowserRunInstructions :filename="filename" />
     </ModalDialog>
   </div>
 </template>
@@ -23,12 +23,12 @@ import { ScriptFilename } from '@/application/CodeRunner/ScriptFilename';
 import { FileType } from '@/presentation/common/Dialog';
 import IconButton from '../IconButton.vue';
 import { createScriptErrorDialog } from '../ScriptErrorDialog';
-import RunInstructions from './RunInstructions/RunInstructions.vue';
+import BrowserRunInstructions from './BrowserRunInstructions/BrowserRunInstructions.vue';
 
 export default defineComponent({
   components: {
     IconButton,
-    RunInstructions,
+    BrowserRunInstructions,
     ModalDialog,
   },
   setup() {
@@ -55,7 +55,12 @@ export default defineComponent({
         }, scriptDiagnosticsCollector)));
         return;
       }
-      areInstructionsVisible.value = true;
+      if (!isRunningAsDesktopApplication) {
+        areInstructionsVisible.value = true;
+      }
+      // On desktop, it would be better to to prompt the user with a system
+      // dialog offering options after saving, such as:
+      // • Open Containing Folder • "Open File" in default text editor • Close
     }
 
     return {
diff --git a/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.spec.ts b/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.spec.ts
index 95255804a..cc5350bcf 100644
--- a/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.spec.ts
+++ b/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.spec.ts
@@ -1,6 +1,6 @@
 import { describe, it, expect } from 'vitest';
 import { VueWrapper, shallowMount } from '@vue/test-utils';
-import CopyableCommand from '@/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/CopyableCommand.vue';
+import CopyableCommand from '@/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/CopyableCommand.vue';
 import { expectThrowsAsync } from '@tests/shared/Assertions/ExpectThrowsAsync';
 import { InjectionKeys } from '@/presentation/injectionSymbols';
 import type { Clipboard } from '@/presentation/components/Shared/Hooks/Clipboard/Clipboard';
diff --git a/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/PlatformInstructionSteps.spec.ts b/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/PlatformInstructionSteps.spec.ts
index aae1688b4..7191e8a07 100644
--- a/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/PlatformInstructionSteps.spec.ts
+++ b/tests/unit/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/PlatformInstructionSteps.spec.ts
@@ -1,14 +1,14 @@
 import { shallowMount } from '@vue/test-utils';
-import PlatformInstructionSteps from '@/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/PlatformInstructionSteps.vue';
+import PlatformInstructionSteps from '@/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/PlatformInstructionSteps.vue';
 import { useCollectionState } from '@/presentation/components/Shared/Hooks/UseCollectionState';
 import { InjectionKeys } from '@/presentation/injectionSymbols';
 import { UseCollectionStateStub } from '@tests/unit/shared/Stubs/UseCollectionStateStub';
 import { AllSupportedOperatingSystems, type SupportedOperatingSystem } from '@tests/shared/TestCases/SupportedOperatingSystems';
 import { OperatingSystem } from '@/domain/OperatingSystem';
 import { CategoryCollectionStateStub } from '@tests/unit/shared/Stubs/CategoryCollectionStateStub';
-import WindowsInstructions from '@/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/WindowsInstructions.vue';
-import MacOsInstructions from '@/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/MacOsInstructions.vue';
-import LinuxInstructions from '@/presentation/components/Code/CodeButtons/Save/RunInstructions/Steps/Platforms/LinuxInstructions.vue';
+import WindowsInstructions from '@/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/WindowsInstructions.vue';
+import MacOsInstructions from '@/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/MacOsInstructions.vue';
+import LinuxInstructions from '@/presentation/components/Code/CodeButtons/Save/BrowserRunInstructions/Steps/Platforms/LinuxInstructions.vue';
 import type { Component } from 'vue';
 
 describe('PlatformInstructionSteps', () => {