Remove compiler link until we have file loading working consistently (#…

…350)

* Suppress compiler link for non-Chromium until we have file loading working consistently
* Add `canUpgradeFs` check

components/src/stores/base.context.ts

@@ -22,6 +22,7 @@ import {
 
 export interface BaseContext {
   fs: FileSystem;
+  canUpgradeFs: boolean;
   upgradeFs: (force?: boolean) => void;
   closeFs: () => void;
   upgraded?: string;
@@ -58,9 +59,10 @@ export function useBaseContext(): BaseContext {
     });
   }, [upgraded, replaceFs]);
 
+  const canUpgradeFs = `showDirectoryPicker` in window;
   const upgradeFs = useCallback(
     async (force = false) => {
-      if (upgraded && !force) return;
+      if (!canUpgradeFs || (upgraded && !force)) return;
       const handler = await openNand2TetrisDirectory();
       const adapter = await createAndStoreLocalAdapterInIndexedDB(handler);
       replaceFs(adapter);
@@ -82,6 +84,7 @@ export function useBaseContext(): BaseContext {
     status,
     setStatus,
     storage: localStorage,
+    canUpgradeFs,
     upgradeFs,
     closeFs,
     upgraded,
@@ -90,6 +93,7 @@ export function useBaseContext(): BaseContext {
 
 export const BaseContext = createContext<BaseContext>({
   fs: new FileSystem(new LocalStorageFileSystemAdapter()),
+  canUpgradeFs: false,
   // eslint-disable-next-line @typescript-eslint/no-empty-function
   upgradeFs() {},
   // eslint-disable-next-line @typescript-eslint/no-empty-function

extension/views/hdl/src/index.tsx

@@ -13,6 +13,7 @@ const baseContext: BaseContext = {
     new ObjectFileSystemAdapter({ "projects/01/Not.hdl": Not.hdl })
   ),
   upgraded: "true",
+  canUpgradeFs: false,
   upgradeFs() {},
   closeFs() {},
   storage: {},

web/src/shell/header.tsx

@@ -67,7 +67,12 @@ const headerButtons: HeaderButton[] = [
   headerButtonFromURL(URLs["cpu"], "developer_board"),
   headerButtonFromURL(URLs["asm"], "list_alt"),
   headerButtonFromURL(URLs["vm"], "computer"),
-  headerButtonFromURL(URLs["compiler"], "code"),
+  // TODO(https://github.com/nand2tetris/web-ide/issues/349)
+  // reenable when this is resolved for Firefox and safari
+  // https://caniuse.com/?search=showDirectoryPicker
+  ...("showDirectoryPicker" in window
+    ? [headerButtonFromURL(URLs["compiler"], "code")]
+    : []),
   headerButtonFromURL(URLs["bitmap"], "grid_on"),
   headerButtonFromURL(URLs["util"], "function", "Converter Tool"),
   {

web/src/shell/settings.tsx

@@ -14,7 +14,7 @@ const showUpgradeFs = false;
 
 export const Settings = () => {
   const { toolStates } = useContext(AppContext);
-  const { fs, setStatus, upgradeFs, closeFs, upgraded } =
+  const { fs, setStatus, canUpgradeFs, upgradeFs, closeFs, upgraded } =
     useContext(BaseContext);
   const { settings, monaco, theme, setTheme, tracking } =
     useContext(AppContext);
@@ -155,7 +155,7 @@ export const Settings = () => {
                 <Trans>Files</Trans>
               </dt>
               <dd>
-                {showUpgradeFs && (
+                {showUpgradeFs && canUpgradeFs ? (
                   <>
                     <button
                       disabled={upgrading}
@@ -194,6 +194,8 @@ export const Settings = () => {
                       <></>
                     )}
                   </>
+                ) : (
+                  <></>
                 )}
                 <button
                   onClick={async () => {

web/src/testing/index.tsx

@@ -37,6 +37,7 @@ export const useTestingAppContext = () => ({
         "projects/01/Not/Not.cmp": Not.cmp,
       }),
     ),
+    canUpgradeFs: false,
     // eslint-disable-next-line @typescript-eslint/no-empty-function
     upgradeFs() {},
     // eslint-disable-next-line @typescript-eslint/no-empty-function