Feature/files context menu

.prettierrc

@@ -1,7 +1,7 @@
 {
   "useTabs": false,
   "printWidth": 80,
-  "tabWidth": 2,
+  "tabWidth": 4,
   "singleQuote": false,
 
   "trailingComma": "none",

src/__tests__/__snapshots__/storybook.test.ts.snap

@@ -17,6 +17,25 @@ exports[`Storyshots Error404 default 1`] = `
 </div>
 `;
 
+exports[`Storyshots Filesystem Context Menu default 1`] = `
+<div
+  className="fileListItemDropdownButton dropdown"
+  id="fileListItemDropdownButton-0"
+>
+  <button
+    aria-expanded={false}
+    aria-haspopup={true}
+    className="no-after dropdown-toggle btn btn-primary"
+    disabled={false}
+    id="fileListItemDropdownButton-0-button"
+    onClick={[Function]}
+    type="button"
+  >
+    ●●●
+  </button>
+</div>
+`;
+
 exports[`Storyshots Filesystem UploadDecisionsModal 1`] = `
 Array [
   <div
@@ -164,7 +183,7 @@ exports[`Storyshots Filesystem default 1`] = `
       <span>
         <button
           className="fade btn btn-primary"
-          disabled={false}
+          disabled={true}
           type="button"
         >
           Rename
@@ -174,20 +193,26 @@ exports[`Storyshots Filesystem default 1`] = `
         >
           <button
             className="btn btn-primary"
-            disabled={false}
+            disabled={true}
             onClick={[Function]}
             type="button"
           >
             Delete
           </button>
           <form
-            action="http://localhost/data/download?="
+            action="http://localhost/data/download"
             className="d-inline"
             method="get"
           >
+            <input
+              className="d-none"
+              name="ids"
+              type="text"
+              value={Array []}
+            />
             <button
               className="btn btn-primary"
-              disabled={false}
+              disabled={true}
               type="submit"
             >
               Download
@@ -253,7 +278,7 @@ exports[`Storyshots Filesystem default 1`] = `
         <div
           className="col-md-1 col-2"
         >
-          Share
+          Interact
         </div>
         <div
           className="col-md-4 col-6"

src/elements/svg/SymbolFile.tsx → src/assets/images/icons/reactSvgIcons/SymbolFile.tsx

@@ -184,6 +184,22 @@ export function FileEarmarkPDFIcon(props: React.SVGProps<SVGSVGElement>) {
     );
 }
 
+export function FileEarmarkBinaryIcon(props: React.SVGProps<SVGSVGElement>) {
+    return (
+        <svg
+            fill="currentColor"
+            viewBox="0 0 16 16"
+            height="1em"
+            width="1em"
+            {...props}
+        >
+            <path d="M4 0h5.5v1H4a1 1 0 00-1 1v12a1 1 0 001 1h8a1 1 0 001-1V4.5h1V14a2 2 0 01-2 2H4a2 2 0 01-2-2V2a2 2 0 012-2z" />
+            <path d="M9.5 3V0L14 4.5h-3A1.5 1.5 0 019.5 3zM5.526 14.09c.976 0 1.524-.79 1.524-2.205 0-1.412-.548-2.203-1.524-2.203-.978 0-1.526.79-1.526 2.203 0 1.415.548 2.206 1.526 2.206zm-.832-2.205c0-1.05.29-1.612.832-1.612.358 0 .607.247.733.721L4.7 12.137a6.749 6.749 0 01-.006-.252zm.832 1.614c-.36 0-.606-.246-.732-.718l1.556-1.145c.003.079.005.164.005.249 0 1.052-.29 1.614-.829 1.614zm5.329.501v-.595H9.73V9.772h-.69l-1.19.786v.688l1.136-.747h.05v2.906h-1.18V14h3z" />
+        </svg>
+    );
+}
+
+
 
 //--------------------------------------------------------------------\\
 //--------------------------------------------------------------------\\

src/background/api/auth.ts

@@ -1,17 +1,12 @@
-import Axios, { AxiosResponse } from "axios";
+import Axios, {AxiosResponse} from "axios";
 
-import { hostname, userPath } from "./api";
+import {hostname, userPath} from "./api";
 
-import { UserState } from "../redux/actions/userTypes";
+import {UserState} from "../redux/actions/userTypes";
 import store from "../redux/store";
-import {
-  addAccessToken,
-  addRefreshToken,
-  checkedCookies,
-  removeTokens
-} from "../redux/actions/tokens";
-import { AccessToken, CookieStatus } from "../redux/actions/tokenTypes";
-import { deleteCookie, getCookie, setCookie } from "../methods/cookies";
+import {addAccessToken, addRefreshToken, checkedCookies, removeTokens} from "../redux/actions/tokens";
+import {AccessToken, CookieStatus} from "../redux/actions/tokenTypes";
+import {deleteCookie, getCookie, setCookie} from "../methods/cookies";
 import {updateUser} from "../redux/actions/user";
 import {hashPassword} from "../methods/passwords";
 
@@ -20,109 +15,110 @@ import {hashPassword} from "../methods/passwords";
 const cookieName: string = "refreshToken";
 
 export interface BackendLoginData {
-  tokenValue: string;
-  user: UserState;
+    tokenValue: string;
+    user: UserState;
 }
 
 export interface BackendAuthData {
-  tokenValue: string;
-  userId: number;
-  validUntil: number;
+    tokenValue: string;
+    userId: number;
+    validUntil: number;
 }
 
 export const checkForCookie = () => {
-  let refreshTokenCookieValue = getCookie(cookieName);
-  if (refreshTokenCookieValue) {
+    let refreshTokenCookieValue = getCookie(cookieName);
+    if (!refreshTokenCookieValue) {
+        return store.dispatch(checkedCookies(CookieStatus.FINISHED));
+    }
+
     store.dispatch(addRefreshToken(refreshTokenCookieValue));
     store.dispatch(checkedCookies(CookieStatus.LOADING));
     getAccessTokenWithRefreshToken();
-  } else {
-    store.dispatch(checkedCookies(CookieStatus.FINISHED));
-  }
+
 };
 
-export const  loginWithUsernameAndPassword = async (
-  userName: string,
-  password: string,
-  stayLoggedIn: boolean
+export const loginWithUsernameAndPassword = async (
+    userName: string,
+    password: string,
+    stayLoggedIn: boolean
 ): Promise<BackendLoginData> => {
-  console.log("[Auth] loginWithUsernameAndPassword", userName);
-  let hashed = await hashPassword(password);
-  return new Promise<BackendLoginData>((resolve, reject) => {
-    let config = {
-      headers: {
-        Authorization: `Basic ${btoa(userName + ":" + hashed)}`
-      }
-    };
-
-    return Axios.get<BackendLoginData>(hostname + userPath + "/login", config)
-      .then((data: AxiosResponse<BackendLoginData>) => {
-        console.log(data.data);
-        store.dispatch(addRefreshToken(data.data.tokenValue));
-        store.dispatch(updateUser(data.data.user as UserState));
-
-        if (stayLoggedIn) {
-          setCookie(cookieName, data.data.tokenValue, 60);
-        }
-
-        getAccessTokenWithRefreshToken();
-      })
-      .catch((error) => {
-        reject(error);
-      });
-  });
+    console.log("[Auth] loginWithUsernameAndPassword", userName);
+    let hashed = await hashPassword(password);
+    return new Promise<BackendLoginData>((resolve, reject) => {
+        let config = {
+            headers: {
+                Authorization: `Basic ${btoa(userName + ":" + hashed)}`
+            }
+        };
+
+        return Axios.get<BackendLoginData>(hostname + userPath + "/login", config)
+            .then((data: AxiosResponse<BackendLoginData>) => {
+                console.log(data.data);
+                store.dispatch(addRefreshToken(data.data.tokenValue));
+                store.dispatch(updateUser(data.data.user as UserState));
+
+                if (stayLoggedIn) {
+                    setCookie(cookieName, data.data.tokenValue, 60);
+                }
+
+                getAccessTokenWithRefreshToken();
+            })
+            .catch((error) => {
+                reject(error);
+            });
+    });
 };
 
 export const getAccessTokenWithRefreshToken = () => {
-  console.log("getAccessTokenWithRefreshToken");
+    console.log("getAccessTokenWithRefreshToken");
 
-  let refreshToken: string | null = store.getState().tokens.refreshToken;
+    let refreshToken: string | null = store.getState().tokens.refreshToken;
 
-  let config = {
-    headers: {
-      Authorization: `Bearer ${refreshToken}`
-    }
-  };
-
-  Axios.get<BackendAuthData>(hostname + userPath + "/auth", config)
-    .then((data: AxiosResponse<BackendAuthData>) => {
-      store.dispatch(checkedCookies(CookieStatus.FINISHED));
-      setAuthHeaderToAxios(data.data.tokenValue);
-
-      store.dispatch(
-        addAccessToken({
-          token: data.data.tokenValue,
-          timestamp: data.data.validUntil
-        } as AccessToken)
-      );
-      if (!store.getState().user.username) {
-        getOwnUserData(data.data.userId);
-      }
-    })
-    .catch((error) => {
-      store.dispatch(removeTokens());
-      store.dispatch(checkedCookies(CookieStatus.FINISHED));
-
-      console.log(error);
-      //you probably want to notify the user, maybe with a toast or similar
-    });
+    let config = {
+        headers: {
+            Authorization: `Bearer ${refreshToken}`
+        }
+    };
+
+    Axios.get<BackendAuthData>(hostname + userPath + "/auth", config)
+        .then((data: AxiosResponse<BackendAuthData>) => {
+            store.dispatch(checkedCookies(CookieStatus.FINISHED));
+            setAuthHeaderToAxios(data.data.tokenValue);
+
+            store.dispatch(
+                addAccessToken({
+                    token: data.data.tokenValue,
+                    timestamp: data.data.validUntil
+                } as AccessToken)
+            );
+            if (!store.getState().user.username) {
+                getOwnUserData(data.data.userId);
+            }
+        })
+        .catch((error) => {
+            store.dispatch(removeTokens());
+            store.dispatch(checkedCookies(CookieStatus.FINISHED));
+
+            console.log(error);
+            //you probably want to notify the user, maybe with a toast or similar
+        });
 };
 
 const getOwnUserData = (userId: number) => {
-  Axios.get<UserState>(`${hostname}${userPath}/${userId}/info`)
-    .then((response: AxiosResponse<UserState>) => {
-      store.dispatch(updateUser(response.data));
-    })
-    .catch((error) => {
-      console.log(error);
-    });
+    Axios.get<UserState>(`${hostname}${userPath}/${userId}/info`)
+        .then((response: AxiosResponse<UserState>) => {
+            store.dispatch(updateUser(response.data));
+        })
+        .catch((error) => {
+            console.log(error);
+        });
 };
 
 export const logout = () => {
-  store.dispatch(removeTokens());
-  deleteCookie(cookieName);
+    store.dispatch(removeTokens());
+    deleteCookie(cookieName);
 };
 
 function setAuthHeaderToAxios(accessToken: string) {
-  Axios.defaults.headers.common["Authorization"] = `Bearer ${accessToken}`;
+    Axios.defaults.headers.common["Authorization"] = `Bearer ${accessToken}`;
 }

src/background/api/filesystemTypes.ts

@@ -27,4 +27,5 @@ export interface FsEntity {
   shared: boolean;
   size: number;
   type: string;
+  mimeType:string;
 }

src/background/methods/arrays.ts

@@ -1,16 +1,15 @@
 export function divideArrayByCondition<T>(
-  input: T[],
-  condition: (a: T) => boolean
+    input: T[],
+    condition: (a: T) => boolean
 ) {
-  let output: T[][] = [[], []];
+    let output: T[][] = [[], []];
 
-  input.forEach((el: T) => {
-    if (condition(el)) {
-      output[0].push(el);
-    } else {
-      output[1].push(el);
-    }
-  });
+    input.forEach((el: T) => {
+        if (!condition(el)) {
+            return output[1].push(el);
+        }
+        output[0].push(el);
+    });
 
-  return output;
+    return output;
 }