Merge pull request #1802 from github/koesie10/path-basename

Show correct query filename on Windows

Author: koesie10

extensions/ql-vscode/src/view/common/__tests__/path.spec.ts

@@ -0,0 +1,43 @@
+import { basename } from "../path";
+
+describe(basename.name, () => {
+  const testCases = [
+    { path: "test.ql", expected: "test.ql" },
+    { path: "PLACEHOLDER/q0.ql", expected: "q0.ql" },
+    {
+      path: "/home/github/projects/vscode-codeql-starter/codeql-custom-queries-javascript/example.ql",
+      expected: "example.ql",
+    },
+    {
+      path: "C:\\Users\\github\\projects\\vscode-codeql-starter\\codeql-custom-queries-javascript\\example.ql",
+      expected: "example.ql",
+    },
+    {
+      path: "/home/github/projects/vscode-codeql-starter/codeql-custom-queries-javascript//",
+      expected: "codeql-custom-queries-javascript",
+    },
+    {
+      path: "C:\\Users\\github\\projects\\vscode-codeql-starter\\codeql-custom-queries-javascript\\",
+      expected: "codeql-custom-queries-javascript",
+    },
+    {
+      path: "/etc/hosts",
+      expected: "hosts",
+    },
+    {
+      path: "/etc/hosts/",
+      expected: "hosts",
+    },
+    {
+      path: "/etc/hosts\\test",
+      expected: "hosts\\test",
+    },
+  ];
+
+  test.each(testCases)(
+    "basename of $path is $expected",
+    ({ path, expected }) => {
+      expect(basename(path)).toEqual(expected);
+    },
+  );
+});

extensions/ql-vscode/src/view/common/path.ts

@@ -0,0 +1,21 @@
+// Returns the basename of a path. Trailing directory separators are ignored.
+// Works for both POSIX and Windows paths.
+export const basename = (path: string): string => {
+  // If the path contains a forward slash, that means it's a POSIX path. Windows does not allow
+  // forward slashes in file names.
+  if (path.includes("/")) {
+    // Trim trailing slashes
+    path = path.replace(/\/+$/, "");
+
+    const index = path.lastIndexOf("/");
+    return index === -1 ? path : path.slice(index + 1);
+  }
+
+  // Otherwise, it's a Windows path. We can use the backslash as a separator.
+
+  // Trim trailing slashes
+  path = path.replace(/\\+$/, "");
+
+  const index = path.lastIndexOf("\\");
+  return index === -1 ? path : path.slice(index + 1);
+};

extensions/ql-vscode/src/view/variant-analysis/VariantAnalysisHeader.tsx

@@ -1,4 +1,3 @@
-import * as path from "path";
 import * as React from "react";
 import { useMemo } from "react";
 import styled from "styled-components";
@@ -12,6 +11,7 @@ import { QueryDetails } from "./QueryDetails";
 import { VariantAnalysisActions } from "./VariantAnalysisActions";
 import { VariantAnalysisStats } from "./VariantAnalysisStats";
 import { parseDate } from "../../pure/date";
+import { basename } from "../common/path";
 
 export type VariantAnalysisHeaderProps = {
   variantAnalysis: VariantAnalysis;
@@ -68,7 +68,7 @@ export const VariantAnalysisHeader = ({
       <Row>
         <QueryDetails
           queryName={variantAnalysis.query.name}
-          queryFileName={path.basename(variantAnalysis.query.filePath)}
+          queryFileName={basename(variantAnalysis.query.filePath)}
           onOpenQueryFileClick={onOpenQueryFileClick}
           onViewQueryTextClick={onViewQueryTextClick}
         />