Add checkbox to desktop version for disabling directory listing

Author: denny241

cmd/path.go

@@ -33,8 +33,9 @@ To expose local directory (e.g. /data/my-data) simply use 'loophole path /data/m
 		quitChannel := make(chan bool)
 
 		exposeConfig := lm.ExposeDirectoryConfig{
-			Local:  dirEndpointSpecs,
-			Remote: remoteEndpointSpecs,
+			Local:                   dirEndpointSpecs,
+			Remote:                  remoteEndpointSpecs,
+			DisableDirectoryListing: config.Config.Display.DisableDirectoryListing,
 		}
 
 		authMethod, err := loophole.RegisterTunnel(&exposeConfig.Remote)

internal/app/loophole/models/ExposeDirectoryConfig.go

@@ -2,6 +2,7 @@ package models
 
 // ExposeDirectoryConfig represents loophole configuration when directory is exposed
 type ExposeDirectoryConfig struct {
-	Local  LocalDirectorySpecs `json:"local"`
-	Remote RemoteEndpointSpecs `json:"remote"`
+	Local                   LocalDirectorySpecs `json:"local"`
+	Remote                  RemoteEndpointSpecs `json:"remote"`
+	DisableDirectoryListing bool                `json:"deactivatedirectorylisting"`
 }

ui/desktop/src/components/form/DirectorySettings.tsx

@@ -0,0 +1,31 @@
+import React from "react";
+
+interface DirectorySettingsProps {
+  usingValue: boolean;
+  usingChangeCallback: Function;
+}
+
+const DirectorySettings = (props: DirectorySettingsProps): JSX.Element => {
+  const disableDirectoryListing = props.usingValue;
+  const setDisableDirectoryListing = props.usingChangeCallback;
+
+  return (
+    <div>
+      <div className="field">
+        <div className="control">
+          <label className="checkbox">
+            <input
+              type="checkbox"
+              onChange={(e) => {
+                setDisableDirectoryListing(!disableDirectoryListing);
+              }}
+            />{" "}
+            I want to disable Directory Listing
+          </label>
+        </div>
+      </div>
+    </div>
+  );
+};
+
+export default DirectorySettings;

ui/desktop/src/interfaces/ExposeDirectoryMessage.ts

@@ -5,4 +5,5 @@ import RemoteEndpointSpecs from './RemoteEndpointSpecs';
 export default interface ExposeDirectoryMessage {
 	local:   LocalDirectorySpecs;
 	remote:  RemoteEndpointSpecs;
+	deactivatedirectorylisting: boolean;
 }

ui/desktop/src/pages/Directory.tsx

@@ -19,6 +19,7 @@ import {
   isLocalPathValid,
   isLoopholeHostnameValid,
 } from "../features/validator/validators";
+import DirectorySettings from "../components/form/DirectorySettings";
 
 const DirectoryPage = () => {
   const dispatch = useDispatch();
@@ -30,6 +31,7 @@ const DirectoryPage = () => {
   const [usingBasicAuth, setUsingBasicAuth] = useState(false);
   const [basicAuthUsername, setBasicAuthUsername] = useState("");
   const [basicAuthPassword, setBasicAuthPassword] = useState("");
+  const [disableDirectoryListing, setDisableDirectoryListing] = useState(false);
 
   const areInputsValid = (): boolean => {
     if (!isLocalPathValid(path)) return false;
@@ -53,6 +55,7 @@ const DirectoryPage = () => {
         disableProxyErrorPage: false,
         tunnelId: uuidv4(),
       },
+      deactivatedirectorylisting: disableDirectoryListing
     };
     if (usingCustomHostname) {
       options.remote.siteId = customHostname;
@@ -105,6 +108,13 @@ const DirectoryPage = () => {
                 passwordChangeCallback={setBasicAuthPassword}
               />
             </div>
+            <div className="column is-12">
+              <h5 className="title is-5">Directory Listing</h5>
+              <DirectorySettings
+                usingValue={disableDirectoryListing}
+                usingChangeCallback={setDisableDirectoryListing}
+              />
+            </div>
             <div className="column is-12">
               <div className="field is-grouped is-pulled-right">
                 <div className="control">

ui/desktop/src/pages/WebDav.tsx

@@ -53,6 +53,7 @@ const WebDav = () => {
         disableProxyErrorPage: false,
         tunnelId: uuidv4(),
       },
+      deactivatedirectorylisting: false,
     };
     if (usingCustomHostname) {
       options.remote.siteId = customHostname;

ui/ui.go

@@ -16,6 +16,7 @@ import (
 
 	"github.com/gorilla/websocket"
 
+	"github.com/loophole/cli/config"
 	"github.com/loophole/cli/internal/app/loophole"
 	lm "github.com/loophole/cli/internal/app/loophole/models"
 	"github.com/loophole/cli/internal/pkg/cache"
@@ -96,6 +97,7 @@ func websocketHandler(w http.ResponseWriter, r *http.Request) {
 				communication.Warn(err.Error())
 			}
 
+			config.Config.Display.DisableDirectoryListing = exposeDirectoryConfig.DisableDirectoryListing
 			tunnelQuitChannel := make(chan bool)
 			go func() {
 				sshDir := cache.GetLocalStorageDir(".ssh") //getting our sshDir and creating it, if it doesn't exist