From af7b0b9ebf19079f459e995a1a55d6c2cae1ba93 Mon Sep 17 00:00:00 2001
From: Yan Chen <48968912+chenyan-dfinity@users.noreply.github.com>
Date: Tue, 10 Sep 2024 11:35:10 -0700
Subject: [PATCH] fetch more files

---
 src/components/Editor.tsx      |  8 +++---
 src/components/Explorer.tsx    |  8 +++---
 src/contexts/WorkplaceState.ts |  3 +++
 src/examples.ts                |  6 ++---
 src/workers/file.ts            | 45 ++++++++++------------------------
 5 files changed, 26 insertions(+), 44 deletions(-)

diff --git a/src/components/Editor.tsx b/src/components/Editor.tsx
index 54813bb9..3202279a 100644
--- a/src/components/Editor.tsx
+++ b/src/components/Editor.tsx
@@ -230,15 +230,15 @@ export function Editor({
           </Button>
         </RightContainer>
       </PanelHeader>
-      <MarkdownContainer isHidden={fileName !== "README"}>
+      <MarkdownContainer isHidden={!fileName.endsWith(".md")}>
         <ReactMarkdown linkTarget="_blank">
-          {fileName === "README" ? fileCode : ""}
+          {fileName.endsWith(".md") ? fileCode : ""}
         </ReactMarkdown>
       </MarkdownContainer>
-      <EditorContainer isHidden={fileName === "README"}>
+      <EditorContainer isHidden={fileName.endsWith(".md")}>
         <MonacoEditor
           defaultLanguage={"motoko"}
-          value={fileName === "README" ? "" : fileCode}
+          value={fileName.endsWith(".md") ? "" : fileCode}
           path={fileName}
           beforeMount={configureMonaco}
           onMount={onEditorMount}
diff --git a/src/components/Explorer.tsx b/src/components/Explorer.tsx
index bf1ce603..79e9a8f7 100644
--- a/src/components/Explorer.tsx
+++ b/src/components/Explorer.tsx
@@ -12,7 +12,7 @@ import {
 import { PackageModal } from "./PackageModal";
 import { FileModal } from "./FileModal";
 import { CanisterModal } from "./CanisterModal";
-import { DeploySetter } from "./DeplayModal";
+import { DeploySetter } from "./DeployModal";
 import { PackageInfo } from "../workers/file";
 import { ILoggingStore } from "./Logger";
 import { deleteCanister } from "../build";
@@ -99,7 +99,7 @@ export function Explorer({ state, ttl, logger, deploySetter }: ExplorerProps) {
           if (action === "delete") {
             const canisterInfo = state.canisters[selectedCanister];
             logger.log(
-              `Deleting canister ${selectedCanister} with id ${canisterInfo.id.toText()}...`
+              `Deleting canister ${selectedCanister} with id ${canisterInfo.id.toText()}...`,
             );
             await deleteCanister(canisterInfo);
             logger.log("Canister deleted");
@@ -132,7 +132,7 @@ export function Explorer({ state, ttl, logger, deploySetter }: ExplorerProps) {
     }
     const timer = setTimeout(() => {
       const times: Array<[string, number | undefined]> = Object.values(
-        state.canisters
+        state.canisters,
       ).map((info) => {
         return [info.name!, calcTimeLeft(info.timestamp)];
       });
@@ -162,7 +162,7 @@ export function Explorer({ state, ttl, logger, deploySetter }: ExplorerProps) {
           } else {
             return { status: "Expired" };
           }
-        })
+        }),
       );
     }, 1000);
     // Clear timeout if the component is unmounted
diff --git a/src/contexts/WorkplaceState.ts b/src/contexts/WorkplaceState.ts
index c90297a4..f37060a4 100644
--- a/src/contexts/WorkplaceState.ts
+++ b/src/contexts/WorkplaceState.ts
@@ -149,6 +149,9 @@ function selectFirstFile(files: Record<string, string>): string | null {
   if ("README" in files) {
     return "README";
   }
+  if ("README.md" in files) {
+    return "README.md";
+  }
   if ("Main.mo" in files) {
     return "Main.mo";
   }
diff --git a/src/examples.ts b/src/examples.ts
index 57fe9d3c..3d811fe9 100644
--- a/src/examples.ts
+++ b/src/examples.ts
@@ -21,8 +21,7 @@ export const exampleProjects: ExampleProject[] = [
   },
   {
     name: "Counter",
-    repo: { dir: "motoko/counter/src", ...example },
-    readme: `${readmeURL}/counter/README.md`,
+    repo: { dir: "motoko/minimal-counter-dapp", ...example },
   },
   {
     name: "Calculator",
@@ -46,8 +45,7 @@ export const exampleProjects: ExampleProject[] = [
   },
   {
     name: "Random Maze",
-    repo: { dir: "motoko/random_maze/src/random_maze", ...example },
-    readme: `${readmeURL}/random_maze/README.md`,
+    repo: { dir: "motoko/random_maze", ...example },
   },
   {
     name: "Game of Life",
diff --git a/src/workers/file.ts b/src/workers/file.ts
index 66b9f1c9..d4e3b1e7 100644
--- a/src/workers/file.ts
+++ b/src/workers/file.ts
@@ -1,17 +1,5 @@
 import { loadMoc } from "./mocShim";
 
-interface ExtraFile {
-  match: RegExp;
-  resolveName(results: RegExpExecArray): string;
-}
-
-const extraFiles: ExtraFile[] = [
-  {
-    match: /^readme\.md$/i,
-    resolveName: () => "README",
-  },
-];
-
 export interface PackageInfo {
   name: string;
   repo: string;
@@ -50,7 +38,7 @@ export async function fetchPackage(info: PackageInfo): Promise<boolean> {
 
 export async function fetchGithub(
   repo: RepoInfo,
-  target_dir = ""
+  target_dir = "",
 ): Promise<Record<string, string> | undefined> {
   const possiblyCDN = !(
     (repo.branch.length % 2 === 0 && /^[A-F0-9]+$/i.test(repo.branch)) ||
@@ -74,9 +62,15 @@ export async function saveWorkplaceToMotoko(files: Record<string, string>) {
   }
 }
 
+const isValidFile = (path: string) => {
+  const validFiles =
+    /\.(mo|md|js|ts|json|txt|png|jpg|jpeg|gif|svg|ico|css|html|tsx|jsx)$/;
+  return validFiles.test(path) && !path.includes("/declarations/");
+};
+
 async function fetchFromCDN(
   repo: RepoInfo,
-  target_dir = ""
+  target_dir = "",
 ): Promise<Record<string, string> | undefined> {
   const Motoko = await loadMoc();
   const meta_url = `https://data.jsdelivr.com/v1/package/gh/${repo.repo}@${repo.branch}/flat`;
@@ -89,18 +83,10 @@ async function fetchFromCDN(
   const promises: any[] = [];
   const files = {};
   for (const f of json.files) {
-    const extraFileName = extraFiles.flatMap(({ match, resolveName }) => {
-      const results = match.exec(f.path);
-      return results ? [resolveName(results)] : [];
-    })[0];
-    if (
-      f.name.startsWith(`/${repo.dir}/`) &&
-      (extraFileName || /\.mo$/i.test(f.name))
-    ) {
+    if (f.name.startsWith(`/${repo.dir}/`) && isValidFile(f.name)) {
       const promise = (async () => {
         const content = await (await fetch(base_url + f.name)).text();
         const stripped =
-          extraFileName ||
           target_dir + f.name.slice(repo.dir ? repo.dir.length + 1 : 0);
         Motoko.saveFile(stripped, content);
         files[stripped] = content;
@@ -118,7 +104,7 @@ async function fetchFromCDN(
 
 async function fetchFromGithub(
   repo: RepoInfo,
-  target_dir = ""
+  target_dir = "",
 ): Promise<Record<string, string> | undefined> {
   const Motoko = await loadMoc();
   const meta_url = `https://api.github.com/repos/${repo.repo}/git/trees/${repo.branch}?recursive=1`;
@@ -131,22 +117,17 @@ async function fetchFromGithub(
   const promises: any[] = [];
   const files = {};
   for (const f of json.tree) {
-    const extraFileName = extraFiles.flatMap(({ match, resolveName }) => {
-      const results = match.exec(f.path);
-      return results ? [resolveName(results)] : [];
-    })[0];
     if (
       f.path.startsWith(repo.dir ? `${repo.dir}/` : "") &&
       f.type === "blob" &&
-      (extraFileName || /\.mo$/i.test(f.path))
+      isValidFile(f.path)
     ) {
       const promise = (async () => {
         const content = await (await fetch(base_url + f.path)).text();
         const stripped =
-          extraFileName ||
           target_dir +
-            (target_dir ? "/" : "") +
-            f.path.slice(repo.dir ? repo.dir.length + 1 : 0);
+          (target_dir ? "/" : "") +
+          f.path.slice(repo.dir ? repo.dir.length + 1 : 0);
         Motoko.saveFile(stripped, content);
         files[stripped] = content;
       })();