Merge pull request #108 from dockersamples/106-open-files-from-links

Prettier updates

Author: mikesir87

components/interface/client/src/WorkshopContext.jsx

@@ -196,4 +196,4 @@ export const useSaveFileCommand = () => {
 
 export const useOpenFile = () => {
   return useContext(WorkshopContext).openFile;
-}
+};

components/interface/client/src/components/WorkshopPanel/markdown/FileLink.jsx

@@ -3,7 +3,7 @@ import { useOpenFile } from "../../../WorkshopContext";
 export function FileLink({ path, line, children }) {
   const openFile = useOpenFile();
 
-  const lineAsNumber = (line) ? parseInt(line, 10) : undefined;
+  const lineAsNumber = line ? parseInt(line, 10) : undefined;
 
   return (
     <a

dd-extension/README.md

@@ -8,33 +8,33 @@ To develop the extension, run the following steps:
 
 1. Install the NPM dependencies:
 
-    ```console
-    npm install
-    ```
+   ```console
+   npm install
+   ```
 
 2. Start the app:
 
-    ```console
-    npm run dev
-    ```
+   ```console
+   npm run dev
+   ```
 
 3. If you don't have the extension installed yet, install it:
 
-    ```console
-    docker extension install dockersamples/labspace-extension
-    ```
+   ```console
+   docker extension install dockersamples/labspace-extension
+   ```
 
 4. Enable debug mode for the extension (to get the Chrome developer tools):
 
-    ```console
-    docker extension dev debug dockersamples/labspace-extension
-    ```
+   ```console
+   docker extension dev debug dockersamples/labspace-extension
+   ```
 
 5. Set the UI source for the extension to be your development environment:
 
-    ```console
-    docker extension dev ui-source dockersamples/labspace-extension http://localhost:5173
-    ```
+   ```console
+   docker extension dev ui-source dockersamples/labspace-extension http://localhost:5173
+   ```
 
 6. Open the extension in Docker Desktop. It will now be using the Vite reload server for the UI, allowing you to make changes and see them reflected immediately.
 
@@ -46,4 +46,4 @@ Once the extension is installed, deep links can be used to launch a Labspace.
 http://open.docker.com/dashboard/extension-tab?extensionId=dockersamples/labspace-extension&location=PUBLISHED_LABSPACE_URL&title=TITLE
 ```
 
-[Click here](http://open.docker.com/dashboard/extension-tab?extensionId=dockersamples/labspace-extension&location=dockersamples/labspace-container-supported-development&title=Demo) to launch a sample Labspace
+[Click here](http://open.docker.com/dashboard/extension-tab?extensionId=dockersamples/labspace-extension&location=dockersamples/labspace-container-supported-development&title=Demo) to launch a sample Labspace

dd-extension/src/DockerContext.jsx

@@ -24,7 +24,7 @@ export function DockerContextProvider({ children }) {
       ? JSON.parse(localStorage.getItem("custom-labspaces"))
       : [],
   );
- 
+
   const [hasLabspace, setHasLabspace] = useState(false);
   const [runningLabspace, setRunningLabspace] = useState(null);
   const [startingLabspace, setStartingLabspace] = useState(null);
@@ -41,7 +41,7 @@ export function DockerContextProvider({ children }) {
           .then((res) => res.text())
           .then((text) => parse(text))
           .then((data) => data.labspaces || []),
-      )
+      ),
     ).then((results) => {
       setLabspaces(results.flat());
     });
@@ -102,23 +102,15 @@ export function DockerContextProvider({ children }) {
 
       ddClient.docker.cli.exec(
         "compose",
-        [
-          "-f",
-          `oci://${location}`,
-          "-p",
-          "labspace",
-          "up",
-          "-d",
-          "-y",
-        ],
+        ["-f", `oci://${location}`, "-p", "labspace", "up", "-d", "-y"],
         {
           stream: {
             onOutput(data) {
               const newData = data.stdout ? data.stdout : data.stderr;
               let result;
               newData.split("\n").forEach((line) => {
                 if (line.trim() === "") return;
-                
+
                 result = logProcessor.processLine(line.trim());
               });
               setLaunchLog(result);
@@ -145,13 +137,18 @@ export function DockerContextProvider({ children }) {
 
   const removeLabspace = useCallback(
     (publishedRepo) => {
-      setAdditionalLabspaces((labs) => labs.filter((l) => l.publishedRepo !== publishedRepo));
+      setAdditionalLabspaces((labs) =>
+        labs.filter((l) => l.publishedRepo !== publishedRepo),
+      );
     },
     [setAdditionalLabspaces],
   );
 
   useEffect(() => {
-    localStorage.setItem("custom-labspaces", JSON.stringify(additionalLabspaces));
+    localStorage.setItem(
+      "custom-labspaces",
+      JSON.stringify(additionalLabspaces),
+    );
   }, [additionalLabspaces]);
 
   if (!labspaces) {
@@ -160,7 +157,7 @@ export function DockerContextProvider({ children }) {
         <Spinner />
         <p>Loading...</p>
       </div>
-    )
+    );
   }
 
   return (
@@ -176,7 +173,9 @@ export function DockerContextProvider({ children }) {
         startingLabspace,
         launchLog,
 
-        highlightedLabspaces: labspaces.filter(l => l.highlighted).slice(0, 3),
+        highlightedLabspaces: labspaces
+          .filter((l) => l.highlighted)
+          .slice(0, 3),
         labspaces: additionalLabspaces,
         addLabspace,
         removeLabspace,

dd-extension/src/Home.jsx

@@ -101,9 +101,7 @@ export function Home() {
               {labspaces.map((labspace) => (
                 <tr key={labspace.title}>
                   <td className="align-middle">{labspace.title}</td>
-                  <td className="align-middle">
-                    {labspace.publishedRepo}
-                  </td>
+                  <td className="align-middle">{labspace.publishedRepo}</td>
                   <td className="text-end">
                     <Button
                       variant="primary"
@@ -138,7 +136,11 @@ export function Home() {
 
       <UrlHandlingModal
         onLaunchConfirmation={(title, location) => {
-          if ([...highlightedLabspaces, ...labspaces].find((l) => l.location === location) === undefined)
+          if (
+            [...highlightedLabspaces, ...labspaces].find(
+              (l) => l.location === location,
+            ) === undefined
+          )
             addLabspace(title, location);
           startLabspace(location);
         }}

dd-extension/src/components/LabspaceCard.jsx

@@ -9,9 +9,7 @@ export function LabspaceCard({ labspace, onLaunch, starting, running }) {
         <Card.Text>{labspace.description}</Card.Text>
       </Card.Body>
       <Card.Footer className="d-flex align-items-center justify-content-between">
-        <div>
-          Created by { labspace.author }
-        </div>
+        <div>Created by {labspace.author}</div>
         <Button onClick={onLaunch} disabled={starting || running}>
           {starting ? "Starting..." : "Launch"}
         </Button>

dd-extension/src/logProcessor.js

@@ -14,28 +14,28 @@ export class LogProcessor {
 
   processLine(line) {
     const downloadMatch = line.match(this.downloadPattern);
-      
+
     if (downloadMatch) {
-        const identifier = downloadMatch[1].trim();
+      const identifier = downloadMatch[1].trim();
 
-        if (this.identifierToLineMapping.has(identifier)) {
-            this.lines[this.identifierToLineMapping.get(identifier)] = line;
-        } else {
-            this.identifierToLineMapping.set(identifier, this.lines.length);
-            this.lines.push(line);
-        }
+      if (this.identifierToLineMapping.has(identifier)) {
+        this.lines[this.identifierToLineMapping.get(identifier)] = line;
+      } else {
+        this.identifierToLineMapping.set(identifier, this.lines.length);
+        this.lines.push(line);
+      }
     } else if (this.resourceCreationPattern.test(line)) {
-        const identifier = line.match(this.resourceCreationPattern)[2];
-        if (this.identifierToLineMapping.has(identifier)) {
-            this.lines[this.identifierToLineMapping.get(identifier)] = line;
-        } else {
-            this.identifierToLineMapping.set(identifier, this.lines.length);
-            this.lines.push(line);
-        }
-    } else {
+      const identifier = line.match(this.resourceCreationPattern)[2];
+      if (this.identifierToLineMapping.has(identifier)) {
+        this.lines[this.identifierToLineMapping.get(identifier)] = line;
+      } else {
+        this.identifierToLineMapping.set(identifier, this.lines.length);
         this.lines.push(line);
+      }
+    } else {
+      this.lines.push(line);
     }
 
     return this.lines.join("\n");
   }
-}
+}