please someone stop me working on this project

src/ui/elements/CopyableBox.tsx

@@ -23,7 +23,6 @@ export class CopyableBox extends Component<CopyableBoxProps> {
   }
 
   componentDidMount(): void {
-    console.log(this.copyButtonRef.current);
     const clipboard = new ClipboardJS(this.copyButtonRef.current);
     addClipboardNotifications(clipboard, 600);
   }

src/ui/pages/Secrets/KeyValue/KeyValueDelete.tsx

@@ -7,13 +7,14 @@ import { SecretTitleElement } from "../SecretTitleElement";
 import { kvListURL, kvViewURL } from "../../pageLinks";
 import { route } from "preact-router";
 import i18next from "i18next";
+import { splitKVPath } from "./kvPathUtils";
 
 export class KeyValueDelete extends Component<DefaultPageProps> {
   errorMessageRef = createRef<ErrorMessage>();
 
   async onDelete() {
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
     const item = this.props.matches["item"];
     const version = this.props.matches["version"];
 
@@ -35,7 +36,7 @@ export class KeyValueDelete extends Component<DefaultPageProps> {
 
   render() {
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
     const item = this.props.matches["item"];
 
     return (

src/ui/pages/Secrets/KeyValue/KeyValueEdit.tsx

@@ -15,6 +15,7 @@ import {
 } from "../../../../utils/dataInterchange";
 import { sortedObjectMap } from "../../../../utils";
 import i18next from "i18next";
+import { combineKVPath, splitKVPath } from "./kvPathUtils";
 
 export type KVEditProps = DefaultPageProps & {
   baseMount: string;
@@ -82,10 +83,11 @@ export class KVEditor extends Component<KVEditProps, KVEditState> {
     }
 
     try {
+      const combined = combineKVPath(this.props.secretPath, this.props.secretItem)
       await this.props.api.createOrUpdateSecret(
         this.props.baseMount,
-        this.props.secretPath.map((e) => e + "/"),
+        combined.secretPath,
-        this.props.secretItem,
+        combined.secretItem,
         parseData(editorContent, this.state.syntax),
       );
       window.history.back();
@@ -116,7 +118,6 @@ export class KVEditor extends Component<KVEditProps, KVEditState> {
           <Select
             selectRef={this.syntaxSelectRef}
             onInput={() => {
-              console.log(this.syntaxSelectRef.current.value);
               this.setState({ syntax: this.syntaxSelectRef.current.value });
             }}
           >
@@ -154,7 +155,7 @@ export class KVEditor extends Component<KVEditProps, KVEditState> {
 export class KeyValueEdit extends Component<DefaultPageProps> {
   render() {
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
     const item = this.props.matches["item"];
 
     return (

src/ui/pages/Secrets/KeyValue/KeyValueList.tsx

@@ -5,6 +5,7 @@ import { DoesNotExistError } from "../../../../types/internalErrors";
 import { Margin } from "../../../elements/Margin";
 import { SecretTitleElement } from "../SecretTitleElement";
 import { TextInput } from "../../../elements/forms/TextInput";
+import { combineKVPath, splitKVPath } from "./kvPathUtils";
 import { delSecretsEngineURL, kvListURL, kvNewURL, kvViewURL } from "../../pageLinks";
 import { route } from "preact-router";
 import { sendErrorNotification } from "../../../elements/ErrorMessage";
@@ -26,10 +27,11 @@ function SecretsList(baseMount: string, secretPath: string[], secrets: string[])
     <li>
       <a
         onClick={async () => {
+          const combined = combineKVPath(secretPath, secret);
           if (secret.endsWith("/")) {
-            route(kvListURL(baseMount, [...secretPath, secret.replace("/", "")]));
+            route(kvListURL(baseMount, [...combined.secretPath, combined.secretItem]));
           } else {
-            route(kvViewURL(baseMount, secretPath, secret));
+            route(kvViewURL(baseMount, combined.secretPath, combined.secretItem));
           }
         }}
       >
@@ -148,9 +150,10 @@ type KeyValueListState = {
 export class KeyValueList extends Component<DefaultPageProps, KeyValueListState> {
   async componentDidMount() {
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/").filter((e) => e.length > 0);
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
 
     const mountsPath = "/sys/mounts/" + baseMount;
+  
     const currentPath = baseMount + secretPath.join();
 
     try {
@@ -172,7 +175,7 @@ export class KeyValueList extends Component<DefaultPageProps, KeyValueListState>
     if (!this.state.pathCaps) return;
 
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
 
     return (
       <>

src/ui/pages/Secrets/KeyValue/KeyValueNew.tsx

@@ -7,6 +7,7 @@ import { InputWithTitle } from "../../../elements/InputWithTitle";
 import { Margin } from "../../../elements/Margin";
 import { SecretTitleElement } from "../SecretTitleElement";
 import { TextInput } from "../../../elements/forms/TextInput";
+import { combineKVPath, splitKVPath } from "./kvPathUtils";
 import { kvViewURL } from "../../pageLinks";
 import { route } from "preact-router";
 import i18next from "i18next";
@@ -31,13 +32,10 @@ export class KeyValueNew extends Component<DefaultPageProps> {
       }
 
       await this.props.api.createOrUpdateSecret(baseMount, secretPath, path, keyData);
-      if (path.includes("/")) {
+
-        const split = path.split("/");
+      const combined = combineKVPath(secretPath, path);
-        const secret = split.pop();
+
-        route(kvViewURL(baseMount, [...secretPath, ...split], secret));
+      route(kvViewURL(baseMount, combined.secretPath, combined.secretItem));
-      } else {
-        route(kvViewURL(baseMount, secretPath, path));
-      }
     } catch (e: unknown) {
       const error = e as Error;
       this.errorMessageRef.current.setErrorMessage(error.message);
@@ -46,7 +44,7 @@ export class KeyValueNew extends Component<DefaultPageProps> {
 
   render() {
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = (this.props.matches["secretPath"] || "").split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"] || "");
 
     return (
       <>

src/ui/pages/Secrets/KeyValue/KeyValueVersions.tsx

@@ -5,11 +5,12 @@ import { kvViewURL } from "../../pageLinks";
 import { objectToMap } from "../../../../utils";
 import { route } from "preact-router";
 import { sendErrorNotification } from "../../../elements/ErrorMessage";
+import { splitKVPath } from "./kvPathUtils";
 
 export class KeyValueVersions extends Component<DefaultPageProps, { versions: string[] }> {
   async componentDidMount() {
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
     const secretItem = this.props.matches["item"];
 
     try {
@@ -27,7 +28,7 @@ export class KeyValueVersions extends Component<DefaultPageProps, { versions: st
   render() {
     if (!this.state.versions) return;
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
     const secretItem = this.props.matches["item"];
 
     return (

src/ui/pages/Secrets/KeyValue/KeyValueView.tsx

@@ -13,6 +13,7 @@ import { kvDeleteURL, kvEditURL, kvVersionsURL } from "../../pageLinks";
 import { sendErrorNotification } from "../../../elements/ErrorMessage";
 import { sortedObjectMap } from "../../../../utils";
 import i18next from "i18next";
+import { splitKVPath } from "./kvPathUtils";
 
 type KVSecretViewDataProps = DefaultPageProps & { data: Map<string, unknown> };
 
@@ -116,7 +117,7 @@ export class KeyValueView extends Component<DefaultPageProps, KeyValueViewState>
 
   async getKVViewData() {
     const baseMount = this.props.matches["baseMount"];
-    const secretPath = this.props.matches["secretPath"].split("/");
+    const secretPath = splitKVPath(this.props.matches["secretPath"]);
     const secretItem = this.props.matches["item"];
     const secretVersion = this.props.matches["version"];
 

src/ui/pages/Secrets/KeyValue/kvPathUtils.ts

@@ -0,0 +1,25 @@
+type CombinedPaths = {
+  secretPath: string[];
+  secretItem: string;
+};
+
+
+export function combineKVPath(secretPath: string[], path: string): CombinedPaths {
+  if (path.includes("/")) {
+    const split = path.split("/");
+    const secret = split.pop();
+    return {
+      secretPath: [...secretPath, ...split].filter((e) => e !== ""),
+      secretItem: secret,
+    };
+  } else {
+    return {
+      secretPath: secretPath.filter((e) => e !== ""),
+      secretItem: path,
+    };
+  }
+}
+
+export function splitKVPath(path: string): string[] {
+  return path.split("/").filter((e) => e !== "");
+} 

src/ui/pages/Secrets/SecretTitleElement.tsx

@@ -29,10 +29,7 @@ export function SecretTitleElement(props: SecretTitleElementProps): JSX.Element
           {"/ "}
         </a>
 
-        <a
+        <a href={"/secrets/" + type + "/list/" + baseMount} test-data="secrets-title-baseMount">
-          href={"/secrets/" + type + "/list/" + baseMount + "/"}
-          test-data="secrets-title-baseMount"
-        >
           {baseMount + "/ "}
         </a>
 

src/ui/pages/pageLinks.tsx

@@ -6,8 +6,17 @@ export function delSecretsEngineURL(baseMount: string): string {
 
 // Secrets / Key Value
 
+export function kvRemoveEndSlash(path: string) {
+  return path.replace(/\/$/, "");
+}
+
+// So links don't end in / to make urls look prettier and make split not return [''] occasionally
+export function kvJoinSecretPath(path: string[]) {
+  return kvRemoveEndSlash(path.filter((e) => e.length != 0).join("/"));
+}
+
 export function kvNewURL(baseMount: string, secretPath?: string[]): string {
-  return `/secrets/kv/new/${baseMount}` + (secretPath ? `/${secretPath.join("/")}` : "");
+  return `/secrets/kv/new/${baseMount}` + (secretPath ? `/${kvJoinSecretPath(secretPath)}` : "");
 }
 
 export function kvDeleteURL(
@@ -16,15 +25,15 @@ export function kvDeleteURL(
   secret: string,
   version = "null",
 ): string {
-  return `/secrets/kv/delete/${secret}/${version}/${baseMount}/${secretPath.join("/")}`;
+  return `/secrets/kv/delete/${secret}/${version}/${baseMount}/${kvJoinSecretPath(secretPath)}`;
 }
 
 export function kvEditURL(baseMount: string, secretPath: string[], secret: string): string {
-  return `/secrets/kv/edit/${secret}/${baseMount}/${secretPath.join("/")}`;
+  return `/secrets/kv/edit/${secret}/${baseMount}/${kvJoinSecretPath(secretPath)}`;
 }
 
 export function kvVersionsURL(baseMount: string, secretPath: string[], secret: string): string {
-  return `/secrets/kv/versions/${secret}/${baseMount}/${secretPath.join("/")}`;
+  return `/secrets/kv/versions/${secret}/${baseMount}/${kvJoinSecretPath(secretPath)}`;
 }
 
 export function kvViewURL(
@@ -33,11 +42,11 @@ export function kvViewURL(
   secret: string,
   version = "null",
 ): string {
-  return `/secrets/kv/view/${secret}/${version}/${baseMount}/${secretPath.join("/")}`;
+  return kvRemoveEndSlash(`/secrets/kv/view/${secret}/${version}/${baseMount}/${kvJoinSecretPath(secretPath)}`);
 }
 
 export function kvListURL(baseMount: string, secretPath: string[]): string {
-  return `/secrets/kv/list/${baseMount}/${secretPath.join("/")}`;
+  return `/secrets/kv/list/${baseMount}/${kvJoinSecretPath(secretPath)}`;
 }
 
 // Secrets / TOTP