diff --git a/.husky/pre-commit b/.husky/pre-commit
new file mode 100755
index 00000000..7d6e7f89
--- /dev/null
+++ b/.husky/pre-commit
@@ -0,0 +1,5 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+prettier --config .prettierrc --write src '!**/*.{scss,css,json}'
+git add -A src/
diff --git a/.husky/pre-push b/.husky/pre-push
index b3d71da1..f45b957b 100755
--- a/.husky/pre-push
+++ b/.husky/pre-push
@@ -1,5 +1,5 @@
#!/bin/sh
. "$(dirname "$0")/_/husky.sh"
-npm test -- --watchAll=false
eslint --max-warnings 0 src --ext .ts --ext .tsx --cache
+npm test -- --watchAll=false
diff --git a/.prettierrc b/.prettierrc
index 6f01081c..f0fc68fa 100644
--- a/.prettierrc
+++ b/.prettierrc
@@ -2,15 +2,12 @@
"useTabs": false,
"printWidth": 80,
"tabWidth": 4,
+ "semi": false,
"singleQuote": false,
-
- "trailingComma": "none",
-
- "jsxBracketSameLine": false,
-
+ "jsxSingleQuote": false,
+ "trailingComma": "es5",
+ "bracketSpacing": true,
+ "bracketSameLine": false,
+ "arrowParens": "always",
"parser": "typescript",
-
- "noSemi": true,
-
- "rcVerbose": true
}
diff --git a/src/__tests__/storybook.test.ts b/src/__tests__/storybook.test.ts
index a97924b0..976be4a0 100644
--- a/src/__tests__/storybook.test.ts
+++ b/src/__tests__/storybook.test.ts
@@ -1,2 +1,2 @@
-import initStoryshots from "@storybook/addon-storyshots";
-initStoryshots();
+import initStoryshots from "@storybook/addon-storyshots"
+initStoryshots()
diff --git a/src/assets/images/icons/reactSvgIcons/SymbolFile.tsx b/src/assets/images/icons/reactSvgIcons/SymbolFile.tsx
index 3effd4c9..cb8c3c5f 100644
--- a/src/assets/images/icons/reactSvgIcons/SymbolFile.tsx
+++ b/src/assets/images/icons/reactSvgIcons/SymbolFile.tsx
@@ -1,4 +1,4 @@
-import * as React from "react";
+import * as React from "react"
//https://reactsvgicons.com/bootstrap
export function FileEarmarkIcon(props: React.SVGProps) {
@@ -13,7 +13,7 @@ export function FileEarmarkIcon(props: React.SVGProps) {
- );
+ )
}
export function FileEarmarkMusicIcon(props: React.SVGProps) {
@@ -32,7 +32,7 @@ export function FileEarmarkMusicIcon(props: React.SVGProps) {
d="M9.757 5.67A1 1 0 0111 6.64v1.75l-2 .5v3.61c0 .495-.301.883-.662 1.123C7.974 13.866 7.499 14 7 14c-.5 0-.974-.134-1.338-.377-.36-.24-.662-.628-.662-1.123s.301-.883.662-1.123C6.026 11.134 6.501 11 7 11c.356 0 .7.068 1 .196V6.89a1 1 0 01.757-.97l1-.25z"
/>
- );
+ )
}
export function FileEarmarkPlayIcon(props: React.SVGProps) {
@@ -48,7 +48,7 @@ export function FileEarmarkPlayIcon(props: React.SVGProps) {
- );
+ )
}
export function FileEarmarkTextIcon(props: React.SVGProps) {
@@ -67,7 +67,7 @@ export function FileEarmarkTextIcon(props: React.SVGProps) {
d="M5 11.5a.5.5 0 01.5-.5h2a.5.5 0 010 1h-2a.5.5 0 01-.5-.5zm0-2a.5.5 0 01.5-.5h5a.5.5 0 010 1h-5a.5.5 0 01-.5-.5zm0-2a.5.5 0 01.5-.5h5a.5.5 0 010 1h-5a.5.5 0 01-.5-.5z"
/>
- );
+ )
}
export function FileEarmarkImageIcon(props: React.SVGProps) {
@@ -88,7 +88,7 @@ export function FileEarmarkImageIcon(props: React.SVGProps) {
d="M6.502 7a1.5 1.5 0 100-3 1.5 1.5 0 000 3z"
/>
- );
+ )
}
export function FileEarmarkRichtextIcon(props: React.SVGProps) {
@@ -107,7 +107,7 @@ export function FileEarmarkRichtextIcon(props: React.SVGProps) {
d="M4.5 12.5A.5.5 0 015 12h3a.5.5 0 010 1H5a.5.5 0 01-.5-.5zm0-2A.5.5 0 015 10h6a.5.5 0 010 1H5a.5.5 0 01-.5-.5zm1.639-3.708l1.33.886 1.854-1.855a.25.25 0 01.289-.047l1.888.974V8.5a.5.5 0 01-.5.5H5a.5.5 0 01-.5-.5V8s1.54-1.274 1.639-1.208zM6.25 6a.75.75 0 100-1.5.75.75 0 000 1.5z"
/>
- );
+ )
}
export function FileEarmarkLock2Icon(props: React.SVGProps) {
@@ -126,7 +126,7 @@ export function FileEarmarkLock2Icon(props: React.SVGProps) {
- );
+ )
}
export function FileEarmarkZipIcon(props: React.SVGProps) {
@@ -146,7 +146,7 @@ export function FileEarmarkZipIcon(props: React.SVGProps) {
/>
- );
+ )
}
export function FileEarmarkCodeIcon(props: React.SVGProps) {
@@ -165,7 +165,7 @@ export function FileEarmarkCodeIcon(props: React.SVGProps) {
d="M8.646 6.646a.5.5 0 01.708 0l2 2a.5.5 0 010 .708l-2 2a.5.5 0 01-.708-.708L10.293 9 8.646 7.354a.5.5 0 010-.708zm-1.292 0a.5.5 0 00-.708 0l-2 2a.5.5 0 000 .708l2 2a.5.5 0 00.708-.708L5.707 9l1.647-1.646a.5.5 0 000-.708z"
/>
- );
+ )
}
export function FileEarmarkPDFIcon(props: React.SVGProps) {
@@ -184,7 +184,7 @@ export function FileEarmarkPDFIcon(props: React.SVGProps) {
d="M7 5a.5.5 0 01.5.5v.634l.549-.317a.5.5 0 11.5.866L8 7l.549.317a.5.5 0 11-.5.866L7.5 7.866V8.5a.5.5 0 01-1 0v-.634l-.549.317a.5.5 0 11-.5-.866L6 7l-.549-.317a.5.5 0 01.5-.866l.549.317V5.5A.5.5 0 017 5zm-2 5.5a.5.5 0 01.5-.5h5a.5.5 0 010 1h-5a.5.5 0 01-.5-.5zm0 2a.5.5 0 01.5-.5h5a.5.5 0 010 1h-5a.5.5 0 01-.5-.5z"
/>
- );
+ )
}
export function FileEarmarkBinaryIcon(props: React.SVGProps) {
@@ -199,7 +199,7 @@ export function FileEarmarkBinaryIcon(props: React.SVGProps) {
- );
+ )
}
//--------------------------------------------------------------------\\
@@ -224,5 +224,5 @@ export function FolderIcon(props: React.SVGProps) {
d="M13.81 4H2.19a1 1 0 00-.996 1.09l.637 7a1 1 0 00.995.91h10.348a1 1 0 00.995-.91l.637-7A1 1 0 0013.81 4zM2.19 3A2 2 0 00.198 5.181l.637 7A2 2 0 002.826 14h10.348a2 2 0 001.991-1.819l.637-7A2 2 0 0013.81 3H2.19z"
/>
- );
+ )
}
diff --git a/src/background/api/api.ts b/src/background/api/api.ts
index 7ad4f269..104ec55b 100644
--- a/src/background/api/api.ts
+++ b/src/background/api/api.ts
@@ -1,38 +1,38 @@
-import Axios from "axios";
-import { constants } from "../constants";
+import Axios from "axios"
+import { constants } from "../constants"
-export const hostname: string = constants.url.API_URL;
+export const hostname: string = constants.url.API_URL
-export const userPath: string = "/v1/users";
+export const userPath: string = "/v1/users"
-export const filesystemPath: string = "/v1/filesystem/";
+export const filesystemPath: string = "/v1/filesystem/"
enum DataIntegrity {
STABLE = "bg-success",
POSSIBLE_RISK = "bg-warning",
- UNSTABLE = "bg-danger"
+ UNSTABLE = "bg-danger",
}
interface SystemHealthData {
- uptimeInSeconds: number;
- userCount: number;
- dataIntegrity: string;
- deployment: string;
- usedStorageInBytes: number;
- version: string;
+ uptimeInSeconds: number
+ userCount: number
+ dataIntegrity: string
+ deployment: string
+ usedStorageInBytes: number
+ version: string
}
function callBackendHealth(): Promise {
return new Promise((resolve, reject) => {
Axios.get(`${hostname}/health`)
.then((data) => {
- resolve(data.data);
+ resolve(data.data)
})
.catch((error) => {
- reject(error);
- });
- });
+ reject(error)
+ })
+ })
}
-export { callBackendHealth, DataIntegrity };
-export type { SystemHealthData };
+export { callBackendHealth, DataIntegrity }
+export type { SystemHealthData }
diff --git a/src/background/api/auth.ts b/src/background/api/auth.ts
index c57887ed..47fc7fa2 100644
--- a/src/background/api/auth.ts
+++ b/src/background/api/auth.ts
@@ -1,131 +1,131 @@
-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 store from "../redux/store";
+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 { updateUser } from "../redux/actions/user";
-import { hashPassword } from "../methods/passwords";
+ 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"
// reference: https://daveceddia.com/access-redux-store-outside-react/
-const cookieName: string = "refreshToken";
+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);
+ let refreshTokenCookieValue = getCookie(cookieName)
if (!refreshTokenCookieValue) {
- return store.dispatch(checkedCookies(CookieStatus.FINISHED));
+ return store.dispatch(checkedCookies(CookieStatus.FINISHED))
}
- store.dispatch(addRefreshToken(refreshTokenCookieValue));
- store.dispatch(checkedCookies(CookieStatus.LOADING));
- getAccessTokenWithRefreshToken();
-};
+ store.dispatch(addRefreshToken(refreshTokenCookieValue))
+ store.dispatch(checkedCookies(CookieStatus.LOADING))
+ getAccessTokenWithRefreshToken()
+}
export const loginWithUsernameAndPassword = async (
userName: string,
password: string,
stayLoggedIn: boolean
): Promise => {
- console.log("[Auth] loginWithUsernameAndPassword", userName);
- let hashed = await hashPassword(password);
+ console.log("[Auth] loginWithUsernameAndPassword", userName)
+ let hashed = await hashPassword(password)
return new Promise((resolve, reject) => {
let config = {
headers: {
- Authorization: `Basic ${btoa(userName + ":" + hashed)}`
- }
- };
+ Authorization: `Basic ${btoa(userName + ":" + hashed)}`,
+ },
+ }
return Axios.get(
hostname + userPath + "/login",
config
)
.then((data: AxiosResponse) => {
- console.log(data.data);
- store.dispatch(addRefreshToken(data.data.tokenValue));
- store.dispatch(updateUser(data.data.user as UserState));
+ 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);
+ setCookie(cookieName, data.data.tokenValue, 60)
}
- getAccessTokenWithRefreshToken();
+ getAccessTokenWithRefreshToken()
})
.catch((error) => {
- reject(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}`
- }
- };
+ Authorization: `Bearer ${refreshToken}`,
+ },
+ }
Axios.get(hostname + userPath + "/auth", config)
.then((data: AxiosResponse) => {
- store.dispatch(checkedCookies(CookieStatus.FINISHED));
- setAuthHeaderToAxios(data.data.tokenValue);
+ store.dispatch(checkedCookies(CookieStatus.FINISHED))
+ setAuthHeaderToAxios(data.data.tokenValue)
store.dispatch(
addAccessToken({
token: data.data.tokenValue,
- timestamp: data.data.validUntil
+ timestamp: data.data.validUntil,
} as AccessToken)
- );
+ )
if (!store.getState().user.username) {
- getOwnUserData(data.data.userId);
+ getOwnUserData(data.data.userId)
}
})
.catch((error) => {
- store.dispatch(removeTokens());
- store.dispatch(checkedCookies(CookieStatus.FINISHED));
+ store.dispatch(removeTokens())
+ store.dispatch(checkedCookies(CookieStatus.FINISHED))
- console.log(error);
+ console.log(error)
//you probably want to notify the user, maybe with a toast or similar
- });
-};
+ })
+}
const getOwnUserData = (userId: number) => {
Axios.get(`${hostname}${userPath}/${userId}/info`)
.then((response: AxiosResponse) => {
- store.dispatch(updateUser(response.data));
+ store.dispatch(updateUser(response.data))
})
.catch((error) => {
- console.log(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}`
}
diff --git a/src/background/api/filesystem.ts b/src/background/api/filesystem.ts
index e2491ab3..0a3be370 100644
--- a/src/background/api/filesystem.ts
+++ b/src/background/api/filesystem.ts
@@ -1,45 +1,45 @@
-import { FsEntity } from "./filesystemTypes";
-import { filesystemPath, hostname } from "./api";
-import Axios, { AxiosError, AxiosResponse } from "axios";
-import { constants } from "../constants";
+import { FsEntity } from "./filesystemTypes"
+import { filesystemPath, hostname } from "./api"
+import Axios, { AxiosError, AxiosResponse } from "axios"
+import { constants } from "../constants"
-import store from "../redux/store";
+import store from "../redux/store"
import {
ApiAction,
ApiActionStatus,
- ApiActionType
-} from "../redux/actions/apiActionsTypes";
+ ApiActionType,
+} from "../redux/actions/apiActionsTypes"
import {
addApiAction,
changeStatus,
- nextFsEntity
-} from "../redux/actions/apiActions";
+ nextFsEntity,
+} from "../redux/actions/apiActions"
import {
addToContents,
removeFromContents,
- removeFromSelected
-} from "../redux/actions/filesystem";
+ removeFromSelected,
+} from "../redux/actions/filesystem"
import {
EditableFileWithPreflightInfo,
- PreflightEntity
-} from "../../components/pages/filesytem/upload/preflightTypes";
-import { isFsEntityInFolder } from "../methods/filesystem";
+ PreflightEntity,
+} from "../../components/pages/filesytem/upload/preflightTypes"
+import { isFsEntityInFolder } from "../methods/filesystem"
-const fhHostname = constants.url.FH_URL;
+const fhHostname = constants.url.FH_URL
export const getFolderContents = (path: string) => {
- console.log("[Get folder content", path);
+ console.log("[Get folder content", path)
return new Promise>((resolve, reject) => {
let config = {
headers: {
- "X-FF-PATH": path
- }
- };
+ "X-FF-PATH": path,
+ },
+ }
Axios.get(hostname + filesystemPath + "contents", config)
.then((response: AxiosResponse) => resolve(response))
- .catch((error) => reject(error));
- });
-};
+ .catch((error) => reject(error))
+ })
+}
export const uploadPreflight = (
files: File[] | EditableFileWithPreflightInfo[],
@@ -52,19 +52,19 @@ export const uploadPreflight = (
path: f.newPath ?? f.path,
// @ts-ignore
mimeType: f.type,
- size: f.size
- }));
+ size: f.size,
+ }))
return new Promise((resolve, reject) => {
Axios.post(
hostname + filesystemPath + parentFolderID + "/upload/preflight",
postData
)
.then((response: AxiosResponse) => {
- resolve(response.data);
+ resolve(response.data)
})
- .catch((error: Error) => reject(error));
- });
-};
+ .catch((error: Error) => reject(error))
+ })
+}
export const uploadFiles = (
files: File[] | EditableFileWithPreflightInfo[],
@@ -74,11 +74,11 @@ export const uploadFiles = (
"[API filesystem] uploading files to folderID",
parentFolderID,
files
- );
+ )
const apiCall = (file: File | EditableFileWithPreflightInfo) => {
return new Promise((resolve, reject) => {
- let formData = new FormData();
- formData.append("file", file);
+ let formData = new FormData()
+ formData.append("file", file)
Axios.post<[FsEntity]>(
fhHostname + "/upload/" + parentFolderID,
formData,
@@ -89,31 +89,31 @@ export const uploadFiles = (
"X-FF-NAME": file.newName ?? file.name,
// @ts-ignore
"X-FF-PATH": file.newPath ?? file.path,
- "X-FF-SIZE": file.size
+ "X-FF-SIZE": file.size,
},
onUploadProgress(progress) {
- console.log("upload progress:", progress);
- }
+ console.log("upload progress:", progress)
+ },
}
)
.then((response: AxiosResponse<[FsEntity]>) => {
- const currentPath = store.getState().filesystem.currentPath;
+ const currentPath = store.getState().filesystem.currentPath
const fsEntityToShow = response.data.find(
(fsEntity: FsEntity) =>
isFsEntityInFolder(fsEntity, currentPath)
- );
+ )
if (fsEntityToShow) {
- store.dispatch(addToContents(fsEntityToShow));
+ store.dispatch(addToContents(fsEntityToShow))
}
- resolve(response);
+ resolve(response)
})
- .catch((error) => reject(error));
- });
- };
- handleMultipleApiActions(files, apiCall, ApiActionType.UPLOAD);
-};
+ .catch((error) => reject(error))
+ })
+ }
+ handleMultipleApiActions(files, apiCall, ApiActionType.UPLOAD)
+}
export const deleteFsEntities = (files: FsEntity[]) => {
const apiCall = (fsEntity: FsEntity) => {
@@ -123,22 +123,22 @@ export const deleteFsEntities = (files: FsEntity[]) => {
)
.then((response: AxiosResponse) => {
response.data.forEach((e) => {
- store.dispatch(removeFromContents(e));
- store.dispatch(removeFromSelected(e));
- });
- resolve(response);
+ store.dispatch(removeFromContents(e))
+ store.dispatch(removeFromSelected(e))
+ })
+ resolve(response)
})
- .catch((error) => reject(error));
- });
- };
- handleMultipleApiActions(files, apiCall, ApiActionType.DELETE);
-};
+ .catch((error) => reject(error))
+ })
+ }
+ handleMultipleApiActions(files, apiCall, ApiActionType.DELETE)
+}
export const createNewFolder = (
folderName: string,
parentFolderID: string
): Promise> => {
- const body = { name: folderName };
+ const body = { name: folderName }
return new Promise((resolve, reject) => {
Axios.post(
@@ -146,21 +146,21 @@ export const createNewFolder = (
body
)
.then((response: AxiosResponse) => resolve(response))
- .catch((error: AxiosError) => reject(error));
- });
-};
+ .catch((error: AxiosError) => reject(error))
+ })
+}
export const searchFsEntities = (
searchString: string
): Promise> => {
- const config = { params: { name: searchString } };
+ const config = { params: { name: searchString } }
return new Promise((resolve, reject) => {
Axios.get(hostname + filesystemPath + "search", config)
.then((response: AxiosResponse) => resolve(response))
- .catch((error: AxiosError) => reject(error));
- });
-};
+ .catch((error: AxiosError) => reject(error))
+ })
+}
function handleMultipleApiActions(
items: Type[],
@@ -168,9 +168,9 @@ function handleMultipleApiActions(
type: ApiActionType,
apiAction?: ApiAction
) {
- let currentIndex;
+ let currentIndex
if (!apiAction) {
- currentIndex = 0;
+ currentIndex = 0
apiAction = {
key: Date.now() + type,
timestamp: Date.now(),
@@ -178,45 +178,43 @@ function handleMultipleApiActions(
status: ApiActionStatus.ONGOING,
progress: currentIndex,
totalAmount: items.length,
- currentFsEntity: items[0]
- };
- store.dispatch(addApiAction(apiAction));
+ currentFsEntity: items[0],
+ }
+ store.dispatch(addApiAction(apiAction))
} else {
// get the info from the store
apiAction = store
.getState()
- .apiActions.actions.find(
- (a: ApiAction) => a.key === apiAction?.key
- );
+ .apiActions.actions.find((a: ApiAction) => a.key === apiAction?.key)
if (
!apiAction ||
apiAction.status === ApiActionStatus.ABORTED ||
apiAction.status === ApiActionStatus.ERROR
) {
- return;
+ return
}
- currentIndex = apiAction.progress + 1;
+ currentIndex = apiAction.progress + 1
console.log(
"current amout " + currentIndex + " total: " + apiAction.totalAmount
- );
+ )
if (currentIndex === apiAction.totalAmount) {
store.dispatch(
changeStatus({
key: apiAction.key,
- status: ApiActionStatus.FINISHED
+ status: ApiActionStatus.FINISHED,
})
- );
- return;
+ )
+ return
} else {
- console.log("dispatch nextFsEntity");
+ console.log("dispatch nextFsEntity")
store.dispatch(
nextFsEntity({
key: apiAction.key,
- currentFsEntity: items[currentIndex]
+ currentFsEntity: items[currentIndex],
})
- );
+ )
}
}
@@ -224,17 +222,17 @@ function handleMultipleApiActions(
.then((response) => {
console.log(
"[API filesystem] handleMultipleApiActions next iteration"
- );
- handleMultipleApiActions(items, action, type, apiAction);
+ )
+ handleMultipleApiActions(items, action, type, apiAction)
})
.catch((error) => {
- console.log("errorr", error);
+ console.log("errorr", error)
store.dispatch(
changeStatus({
key: apiAction?.key ?? "ts sucks",
status: ApiActionStatus.ERROR,
- error: error.response?.data.message
+ error: error.response?.data.message,
})
- );
- });
+ )
+ })
}
diff --git a/src/background/api/filesystemTypes.ts b/src/background/api/filesystemTypes.ts
index e6fed5dc..1025ac04 100644
--- a/src/background/api/filesystemTypes.ts
+++ b/src/background/api/filesystemTypes.ts
@@ -1,31 +1,31 @@
export interface UsersSet {
- groups: string[];
- id: number;
- username: string;
+ groups: string[]
+ id: number
+ username: string
}
export interface PermissionSet {
- editableForGroups: string[];
- editableForUsers: UsersSet[];
- visibleForGroups: string[];
- visibleForUsers: UsersSet[];
+ editableForGroups: string[]
+ editableForUsers: UsersSet[]
+ visibleForGroups: string[]
+ visibleForUsers: UsersSet[]
}
export interface User {
- userId: number;
- username: string;
- groups: string[];
+ userId: number
+ username: string
+ groups: string[]
}
export interface FsEntity {
- owner: User;
- lastUpdatedBy: User;
- fileSystemId: number;
- lastUpdated: number;
- name: string;
- path: string;
- shared: boolean;
- size: number;
- type: string;
- mimeType: string;
+ owner: User
+ lastUpdatedBy: User
+ fileSystemId: number
+ lastUpdated: number
+ name: string
+ path: string
+ shared: boolean
+ size: number
+ type: string
+ mimeType: string
}
diff --git a/src/background/api/registration.ts b/src/background/api/registration.ts
index 765a48c2..05ea2865 100644
--- a/src/background/api/registration.ts
+++ b/src/background/api/registration.ts
@@ -1,11 +1,11 @@
-import Axios, { AxiosError, AxiosResponse } from "axios";
-import { hostname, userPath } from "./api";
-import { hashPassword } from "../methods/passwords";
+import Axios, { AxiosError, AxiosResponse } from "axios"
+import { hostname, userPath } from "./api"
+import { hashPassword } from "../methods/passwords"
export interface IRegisterServerResponse {
- httpStatus: number;
- httpMessage: string;
- outputMessage?: string;
+ httpStatus: number
+ httpMessage: string
+ outputMessage?: string
}
export const registerNewUser = async (
@@ -14,39 +14,39 @@ export const registerNewUser = async (
passwordConfirmation: string
): Promise => {
if (password !== passwordConfirmation) {
- throw new Error("Password did not match passwordConfirmation");
+ throw new Error("Password did not match passwordConfirmation")
}
- let hashedPassword = await hashPassword(password);
+ let hashedPassword = await hashPassword(password)
return new Promise((resolve, reject) => {
const newUser = {
username: username,
password: hashedPassword,
- confirmationPassword: hashedPassword
- };
+ confirmationPassword: hashedPassword,
+ }
return Axios.post(hostname + userPath + "/register", newUser)
.then((data: AxiosResponse
- );
+ )
}
diff --git a/src/components/pages/errors/Error404.stories.tsx b/src/components/pages/errors/Error404.stories.tsx
index c4db80c8..6894ce52 100644
--- a/src/components/pages/errors/Error404.stories.tsx
+++ b/src/components/pages/errors/Error404.stories.tsx
@@ -1,10 +1,10 @@
-import React from "react";
-import { storiesOf } from "@storybook/react";
-import Error404 from "./Error404";
-import { BrowserRouter } from "react-router-dom";
+import React from "react"
+import { storiesOf } from "@storybook/react"
+import Error404 from "./Error404"
+import { BrowserRouter } from "react-router-dom"
storiesOf("Error404", module).add("default", () => (
-));
+))
diff --git a/src/components/pages/errors/Error404.tsx b/src/components/pages/errors/Error404.tsx
index 69bc6820..4f320e0f 100644
--- a/src/components/pages/errors/Error404.tsx
+++ b/src/components/pages/errors/Error404.tsx
@@ -1,6 +1,6 @@
-import React from "react";
-import { Link } from "react-router-dom";
-import { Container } from "react-bootstrap";
+import React from "react"
+import { Link } from "react-router-dom"
+import { Container } from "react-bootstrap"
export default function Error404() {
return (
@@ -9,5 +9,5 @@ export default function Error404() {
Go to Home
- );
+ )
}
diff --git a/src/components/pages/filesytem/ApiActionsInfo.tsx b/src/components/pages/filesytem/ApiActionsInfo.tsx
index 02016a87..fcdde72f 100644
--- a/src/components/pages/filesytem/ApiActionsInfo.tsx
+++ b/src/components/pages/filesytem/ApiActionsInfo.tsx
@@ -1,17 +1,17 @@
-import { ReactElement } from "react";
-import { useSelector } from "react-redux";
-import { RootState } from "../../../background/redux/store";
+import { ReactElement } from "react"
+import { useSelector } from "react-redux"
+import { RootState } from "../../../background/redux/store"
export const ApiActionsInfo = (): ReactElement => {
const ongoingActions = useSelector(
(state: RootState) => state.apiActions.actions
- );
+ )
return (
<>
{ongoingActions
.sort((a, b) => {
- return a.timestamp - b.timestamp;
+ return a.timestamp - b.timestamp
})
.map((a) => (
@@ -27,5 +27,5 @@ export const ApiActionsInfo = (): ReactElement => {
))}
>
- );
-};
+ )
+}
diff --git a/src/components/pages/filesytem/FileItemContextMenu.stories.tsx b/src/components/pages/filesytem/FileItemContextMenu.stories.tsx
index 4cd7da69..0142e7e5 100644
--- a/src/components/pages/filesytem/FileItemContextMenu.stories.tsx
+++ b/src/components/pages/filesytem/FileItemContextMenu.stories.tsx
@@ -1,6 +1,6 @@
-import { storiesOf } from "@storybook/react";
-import React from "react";
-import FileItemContextMenu from "./FileItemContextMenu";
+import { storiesOf } from "@storybook/react"
+import React from "react"
+import FileItemContextMenu from "./FileItemContextMenu"
const item = {
fileSystemId: 34,
@@ -12,9 +12,9 @@ const item = {
lastUpdated: 1621427873,
type: "APPLICATION",
mimeType: "application/octet-stream",
- shared: false
-};
+ shared: false,
+}
storiesOf("Filesystem", module).add("FilesystemContextMenu", () => {
- return ;
-});
+ return
+})
diff --git a/src/components/pages/filesytem/FileItemContextMenu.tsx b/src/components/pages/filesytem/FileItemContextMenu.tsx
index e46de2ce..d4315de2 100644
--- a/src/components/pages/filesytem/FileItemContextMenu.tsx
+++ b/src/components/pages/filesytem/FileItemContextMenu.tsx
@@ -1,20 +1,20 @@
-import React, { ReactElement, useCallback } from "react";
-import { Dropdown } from "react-bootstrap";
-import { constants } from "../../../background/constants";
-import { FsEntity } from "../../../background/api/filesystemTypes";
-import { deleteFsEntities } from "../../../background/api/filesystem";
+import React, { ReactElement, useCallback } from "react"
+import { Dropdown } from "react-bootstrap"
+import { constants } from "../../../background/constants"
+import { FsEntity } from "../../../background/api/filesystemTypes"
+import { deleteFsEntities } from "../../../background/api/filesystem"
interface FileItemContextMenuInterface {
- fsEntity: FsEntity;
+ fsEntity: FsEntity
}
interface DropdownItemTitleInterface {
- icon?: string;
- description: string;
- selectedID: number;
- target?: string;
- onclick?: () => void;
- disabled?: boolean;
+ icon?: string
+ description: string
+ selectedID: number
+ target?: string
+ onclick?: () => void
+ disabled?: boolean
}
const DropdownItem = (props: DropdownItemTitleInterface): ReactElement => {
@@ -23,8 +23,8 @@ const DropdownItem = (props: DropdownItemTitleInterface): ReactElement => {
description,
target,
disabled = false,
- onclick = () => {}
- } = props;
+ onclick = () => {},
+ } = props
return (
@@ -34,11 +34,11 @@ const DropdownItem = (props: DropdownItemTitleInterface): ReactElement => {
{description}
- );
-};
+ )
+}
const DropdownItemDownload = (props: DropdownItemTitleInterface) => {
- const { icon, description, selectedID, disabled = false } = props;
+ const { icon, description, selectedID, disabled = false } = props
return (
{
{description}
- );
-};
+ )
+}
function FileItemContextMenu(props: FileItemContextMenuInterface) {
- const deleteAction = useCallback(() => deleteFsEntities([props.fsEntity]), [
- props.fsEntity
- ]);
- const id = props.fsEntity.fileSystemId;
+ const deleteAction = useCallback(
+ () => deleteFsEntities([props.fsEntity]),
+ [props.fsEntity]
+ )
+ const id = props.fsEntity.fileSystemId
return (
- );
+ )
}
-export default FileItemContextMenu;
+export default FileItemContextMenu
diff --git a/src/components/pages/filesytem/FileList.tsx b/src/components/pages/filesytem/FileList.tsx
index 7366bcdf..5f254ff8 100644
--- a/src/components/pages/filesytem/FileList.tsx
+++ b/src/components/pages/filesytem/FileList.tsx
@@ -1,35 +1,35 @@
-import React, { ReactElement, useEffect, useState } from "react";
-import { getFolderContents } from "../../../background/api/filesystem";
-import { FsEntity } from "../../../background/api/filesystemTypes";
-import { Col, Container, Row } from "react-bootstrap";
-import { useLocation } from "react-router-dom";
-import { FilesBreadcrumb } from "./FilesBreadcrumb";
-import { filesBaseUrl } from "./Filesystem";
-import FileListItem from "./FileListItem";
-import { SystemState } from "../../../background/redux/actions/sytemState";
+import React, { ReactElement, useEffect, useState } from "react"
+import { getFolderContents } from "../../../background/api/filesystem"
+import { FsEntity } from "../../../background/api/filesystemTypes"
+import { Col, Container, Row } from "react-bootstrap"
+import { useLocation } from "react-router-dom"
+import { FilesBreadcrumb } from "./FilesBreadcrumb"
+import { filesBaseUrl } from "./Filesystem"
+import FileListItem from "./FileListItem"
+import { SystemState } from "../../../background/redux/actions/sytemState"
import {
addToSelected,
clearSelected,
setContents,
setCurrentFsItemId,
- setCurrentPath
-} from "../../../background/redux/actions/filesystem";
-import { connect, ConnectedProps } from "react-redux";
-import { FFLoading } from "../../basicElements/Loading";
-import { AxiosResponse } from "axios";
-import FileListHeader from "./FileListHeader";
-import SelectedFsEntities from "./SelectedFsEntities";
-import ToolbarActions from "./ToolbarActions";
-import fileListSize from "./fileListSize";
+ setCurrentPath,
+} from "../../../background/redux/actions/filesystem"
+import { connect, ConnectedProps } from "react-redux"
+import { FFLoading } from "../../basicElements/Loading"
+import { AxiosResponse } from "axios"
+import FileListHeader from "./FileListHeader"
+import SelectedFsEntities from "./SelectedFsEntities"
+import ToolbarActions from "./ToolbarActions"
+import fileListSize from "./fileListSize"
const mapState = (state: SystemState) => ({
filesystem: {
selectedFsEntities: state.filesystem.selectedFsEntities,
folderContents: state.filesystem.folderContents,
currentFsItemId: state.filesystem.currentFsItemId,
- currentPath: state.filesystem.currentPath
- }
-});
+ currentPath: state.filesystem.currentPath,
+ },
+})
// this takes the redux actions and maps them to the props
const mapDispatch = {
@@ -37,82 +37,82 @@ const mapDispatch = {
clearSelected,
setContents,
setCurrentFsItemId,
- setCurrentPath
-};
+ setCurrentPath,
+}
-const connector = connect(mapState, mapDispatch);
+const connector = connect(mapState, mapDispatch)
-type PropsFromRedux = ConnectedProps;
+type PropsFromRedux = ConnectedProps
-type reduxProps = PropsFromRedux & {};
+type reduxProps = PropsFromRedux & {}
function FileList(props: reduxProps): ReactElement {
- let location = useLocation();
+ let location = useLocation()
- const path = props.filesystem.currentPath;
+ const path = props.filesystem.currentPath
- const filesAndFolders: FsEntity[] = props.filesystem.folderContents;
- const setFilesAndFolders = props.setContents;
- const [error, setError] = useState("");
- const [loading, setLoading] = useState(true);
+ const filesAndFolders: FsEntity[] = props.filesystem.folderContents
+ const setFilesAndFolders = props.setContents
+ const [error, setError] = useState("")
+ const [loading, setLoading] = useState(true)
const allAreSelected =
filesAndFolders?.length ===
props.filesystem.selectedFsEntities.length &&
- !!filesAndFolders?.length;
+ !!filesAndFolders?.length
- const clearSelected = props.clearSelected;
- const setContents = props.setContents;
- const setCurrentPath = props.setCurrentPath;
- const setCurrentFsItemId = props.setCurrentFsItemId;
+ const clearSelected = props.clearSelected
+ const setContents = props.setContents
+ const setCurrentPath = props.setCurrentPath
+ const setCurrentFsItemId = props.setCurrentFsItemId
useEffect((): void => {
function updateStates(newPath: string): void {
getFolderContents(newPath)
.then((response: AxiosResponse) => {
- console.log("got folder content", response);
- setLoading(false);
+ console.log("got folder content", response)
+ setLoading(false)
setContents([
...response.data.filter(
(fsEntity: FsEntity) => fsEntity.type === "FOLDER"
),
...response.data.filter(
(fsEntity: FsEntity) => fsEntity.type !== "FOLDER"
- )
- ]);
- setError("");
- setCurrentFsItemId(response.headers["x-ff-current"]);
+ ),
+ ])
+ setError("")
+ setCurrentFsItemId(response.headers["x-ff-current"])
})
.catch((err) => {
- setError(err.response?.data?.message);
- setFilesAndFolders([]);
- });
+ setError(err.response?.data?.message)
+ setFilesAndFolders([])
+ })
}
- const newPath = location.pathname.slice(filesBaseUrl.length) || "/";
- setCurrentPath(newPath);
- clearSelected();
- setLoading(true);
- updateStates(newPath);
+ const newPath = location.pathname.slice(filesBaseUrl.length) || "/"
+ setCurrentPath(newPath)
+ clearSelected()
+ setLoading(true)
+ updateStates(newPath)
}, [
setContents,
setCurrentFsItemId,
setFilesAndFolders,
clearSelected,
setCurrentPath,
- location
- ]);
+ location,
+ ])
function FileListStatus(): ReactElement {
if (error && !filesAndFolders.length) {
- return {error};
+ return {error}
}
if (loading) {
- return ;
+ return
}
if (filesAndFolders.length === 0) {
- return Nothing to see here.;
+ return Nothing to see here.
}
- return <>>;
+ return <>>
}
// console.log("[FileList path]" + path, filesAndFolders);
@@ -150,11 +150,11 @@ function FileList(props: reduxProps): ReactElement {
/>
{/**/}
- );
+ )
})}
- );
+ )
}
-export default connector(FileList);
+export default connector(FileList)
diff --git a/src/components/pages/filesytem/FileListHeader.tsx b/src/components/pages/filesytem/FileListHeader.tsx
index 8eda1615..e61119d8 100644
--- a/src/components/pages/filesytem/FileListHeader.tsx
+++ b/src/components/pages/filesytem/FileListHeader.tsx
@@ -1,40 +1,40 @@
-import { FsEntity } from "../../../background/api/filesystemTypes";
-import React, { ReactElement, useState } from "react";
-import { ClearSelected } from "../../../background/redux/actions/filesystemTypes";
-import { Col, Form, Row } from "react-bootstrap";
+import { FsEntity } from "../../../background/api/filesystemTypes"
+import React, { ReactElement, useState } from "react"
+import { ClearSelected } from "../../../background/redux/actions/filesystemTypes"
+import { Col, Form, Row } from "react-bootstrap"
import {
clearSelected,
- replaceSelected
-} from "../../../background/redux/actions/filesystem";
-import { connect, ConnectedProps } from "react-redux";
-import { SystemState } from "../../../background/redux/actions/sytemState";
-import fileListSize from "./fileListSize";
+ replaceSelected,
+} from "../../../background/redux/actions/filesystem"
+import { connect, ConnectedProps } from "react-redux"
+import { SystemState } from "../../../background/redux/actions/sytemState"
+import fileListSize from "./fileListSize"
interface FileListHeaderInterface {
- allAreSelected: boolean;
- filesAndFolders: FsEntity[];
- setFilesAndFolders: (content: FsEntity[]) => {};
+ allAreSelected: boolean
+ filesAndFolders: FsEntity[]
+ setFilesAndFolders: (content: FsEntity[]) => {}
}
export const mapState = (state: SystemState) => ({
filesystem: {
selectedFsEntities: state.filesystem.selectedFsEntities,
folderContents: state.filesystem.folderContents,
- currentFsItemId: state.filesystem.currentFsItemId
- }
-});
+ currentFsItemId: state.filesystem.currentFsItemId,
+ },
+})
// this takes the redux actions and maps them to the props
const mapDispatch = {
clearSelected,
- replaceSelected
-};
+ replaceSelected,
+}
-const connector = connect(mapState, mapDispatch);
+const connector = connect(mapState, mapDispatch)
-type PropsFromRedux = ConnectedProps;
+type PropsFromRedux = ConnectedProps
-type TReduxProps = PropsFromRedux & FileListHeaderInterface;
+type TReduxProps = PropsFromRedux & FileListHeaderInterface
function FileListHeader(props: TReduxProps): ReactElement {
const {
@@ -42,39 +42,39 @@ function FileListHeader(props: TReduxProps): ReactElement {
filesAndFolders,
setFilesAndFolders,
clearSelected,
- replaceSelected
- } = props;
+ replaceSelected,
+ } = props
- const [sortIncreasing, setSortIncreasing] = useState(false);
- const [sortedBy, setSortedBy] = useState(null);
+ const [sortIncreasing, setSortIncreasing] = useState(false)
+ const [sortedBy, setSortedBy] = useState(null)
const handleSelectAllChanged = (): void | ClearSelected => {
if (allAreSelected) {
- return clearSelected();
+ return clearSelected()
}
if (filesAndFolders) {
- replaceSelected([...filesAndFolders]);
+ replaceSelected([...filesAndFolders])
}
- };
+ }
function handleSortClick(property: keyof FsEntity): void {
if (!filesAndFolders || filesAndFolders.length < 2) {
- return;
+ return
}
- setSortingOrder(property);
- let toSort = [...(filesAndFolders ?? [])];
+ setSortingOrder(property)
+ let toSort = [...(filesAndFolders ?? [])]
- toSort.sort(getSortingFunction(property));
- setFilesAndFolders(sortIncreasing ? toSort.reverse() : toSort);
+ toSort.sort(getSortingFunction(property))
+ setFilesAndFolders(sortIncreasing ? toSort.reverse() : toSort)
}
function setSortingOrder(property: keyof FsEntity): void {
if (sortedBy === property) {
- return setSortIncreasing(!sortIncreasing);
+ return setSortIncreasing(!sortIncreasing)
}
- setSortedBy(property);
- setSortIncreasing(true);
+ setSortedBy(property)
+ setSortIncreasing(true)
}
function getSortingFunction(
@@ -86,7 +86,7 @@ function FileListHeader(props: TReduxProps): ReactElement {
return (a: any, b: any) =>
a[property] - b[property] === 0
? a.fileSystemId - b.fileSystemId
- : a[property] - b[property];
+ : a[property] - b[property]
case "name":
case "type":
return (a: any, b: any) =>
@@ -96,7 +96,7 @@ function FileListHeader(props: TReduxProps): ReactElement {
? a.fileSystemId - b.fileSystemId
: a[property]
.toLowerCase()
- .localeCompare(b[property].toLowerCase());
+ .localeCompare(b[property].toLowerCase())
case "lastUpdated":
default:
return (a: any, b: any) =>
@@ -110,7 +110,7 @@ function FileListHeader(props: TReduxProps): ReactElement {
.toLowerCase()
.localeCompare(
b.lastUpdatedBy.username.toLowerCase()
- );
+ )
}
}
@@ -176,7 +176,7 @@ function FileListHeader(props: TReduxProps): ReactElement {
- );
+ )
}
-export default connector(FileListHeader);
+export default connector(FileListHeader)
diff --git a/src/components/pages/filesytem/FileListItem.tsx b/src/components/pages/filesytem/FileListItem.tsx
index 6c379b06..76a9da87 100644
--- a/src/components/pages/filesytem/FileListItem.tsx
+++ b/src/components/pages/filesytem/FileListItem.tsx
@@ -1,53 +1,53 @@
-import { FsEntity } from "../../../background/api/filesystemTypes";
-import React, { ReactElement } from "react";
-import { Col, Form } from "react-bootstrap";
-import { Link } from "react-router-dom";
-import { getDateAsStringFromTimestamp } from "../../../background/methods/dataTypes/time";
-import { formatBytes } from "../../../background/methods/dataTypes/bytes";
-import { connect, ConnectedProps } from "react-redux";
-import { SystemState } from "../../../background/redux/actions/sytemState";
+import { FsEntity } from "../../../background/api/filesystemTypes"
+import React, { ReactElement } from "react"
+import { Col, Form } from "react-bootstrap"
+import { Link } from "react-router-dom"
+import { getDateAsStringFromTimestamp } from "../../../background/methods/dataTypes/time"
+import { formatBytes } from "../../../background/methods/dataTypes/bytes"
+import { connect, ConnectedProps } from "react-redux"
+import { SystemState } from "../../../background/redux/actions/sytemState"
import {
addToSelected,
- removeFromSelected
-} from "../../../background/redux/actions/filesystem";
-import FileIcon from "./fileIcon/FileIcon";
-import FileItemContextMenu from "./FileItemContextMenu";
-import fileListSize from "./fileListSize";
+ removeFromSelected,
+} from "../../../background/redux/actions/filesystem"
+import FileIcon from "./fileIcon/FileIcon"
+import FileItemContextMenu from "./FileItemContextMenu"
+import fileListSize from "./fileListSize"
const mapState = (state: SystemState) => ({
filesystem: {
- selectedFsEntities: state.filesystem.selectedFsEntities
- }
-});
+ selectedFsEntities: state.filesystem.selectedFsEntities,
+ },
+})
// this takes the redux actions and maps them to the props
const mapDispatch = {
addToSelected,
- removeFromSelected
-};
+ removeFromSelected,
+}
-const connector = connect(mapState, mapDispatch);
+const connector = connect(mapState, mapDispatch)
-type PropsFromRedux = ConnectedProps;
+type PropsFromRedux = ConnectedProps
type Props = PropsFromRedux & {
- fileListItem: FsEntity;
-};
+ fileListItem: FsEntity
+}
function FileListItem(props: Props): ReactElement {
let isSelected = !!props.filesystem.selectedFsEntities.find(
(e: FsEntity) => e.fileSystemId === props.fileListItem.fileSystemId
- );
+ )
const handleSelectedChanged = () => {
if (!isSelected) {
- return props.addToSelected(props.fileListItem);
+ return props.addToSelected(props.fileListItem)
}
- props.removeFromSelected(props.fileListItem);
- };
+ props.removeFromSelected(props.fileListItem)
+ }
const isFolder =
- props.fileListItem.type && props.fileListItem.type === "FOLDER";
+ props.fileListItem.type && props.fileListItem.type === "FOLDER"
return (
<>
@@ -120,7 +120,7 @@ function FileListItem(props: Props): ReactElement {
{formatBytes(props.fileListItem.size)}
>
- );
+ )
}
-export default connector(FileListItem);
+export default connector(FileListItem)
diff --git a/src/components/pages/filesytem/FilesBreadcrumb.tsx b/src/components/pages/filesytem/FilesBreadcrumb.tsx
index 73d3e51d..21dcf931 100644
--- a/src/components/pages/filesytem/FilesBreadcrumb.tsx
+++ b/src/components/pages/filesytem/FilesBreadcrumb.tsx
@@ -1,14 +1,14 @@
-import React, { ReactElement } from "react";
-import { Breadcrumb } from "react-bootstrap";
-import { Link } from "react-router-dom";
-import { filesBaseUrl } from "./Filesystem";
+import React, { ReactElement } from "react"
+import { Breadcrumb } from "react-bootstrap"
+import { Link } from "react-router-dom"
+import { filesBaseUrl } from "./Filesystem"
type Props = {
- path: string;
-};
+ path: string
+}
export function FilesBreadcrumb(props: Props): ReactElement {
- const folders = props.path.split("/").filter((s: string) => s);
+ const folders = props.path.split("/").filter((s: string) => s)
return (
{folder}{" "}
- );
+ )
})}
- );
+ )
}
diff --git a/src/components/pages/filesytem/Filesystem.stories.tsx b/src/components/pages/filesytem/Filesystem.stories.tsx
index 3ad0dafb..19f7dfea 100644
--- a/src/components/pages/filesytem/Filesystem.stories.tsx
+++ b/src/components/pages/filesytem/Filesystem.stories.tsx
@@ -1,22 +1,22 @@
-import React from "react";
-import { storiesOf } from "@storybook/react";
-import { BrowserRouter } from "react-router-dom";
-import "../../../style/custom.scss";
-import FileSystem from "./Filesystem";
-import { Provider } from "react-redux";
-import store from "../../../background/redux/store";
-import { filesystemPath, hostname } from "../../../background/api/api";
-import MockAdapter from "axios-mock-adapter";
-import axios from "axios";
-import folderContentMock from "./__tests__/folderContentMock.json";
+import React from "react"
+import { storiesOf } from "@storybook/react"
+import { BrowserRouter } from "react-router-dom"
+import "../../../style/custom.scss"
+import FileSystem from "./Filesystem"
+import { Provider } from "react-redux"
+import store from "../../../background/redux/store"
+import { filesystemPath, hostname } from "../../../background/api/api"
+import MockAdapter from "axios-mock-adapter"
+import axios from "axios"
+import folderContentMock from "./__tests__/folderContentMock.json"
-const API_REQUEST = hostname + filesystemPath + "contents";
+const API_REQUEST = hostname + filesystemPath + "contents"
storiesOf("Filesystem", module).add("default", () => {
- const mock = new MockAdapter(axios);
+ const mock = new MockAdapter(axios)
mock.onGet(API_REQUEST).reply(200, folderContentMock, {
- "x-ff-current": "3"
- });
+ "x-ff-current": "3",
+ })
return (
@@ -24,5 +24,5 @@ storiesOf("Filesystem", module).add("default", () => {
- );
-});
+ )
+})
diff --git a/src/components/pages/filesytem/Filesystem.tsx b/src/components/pages/filesytem/Filesystem.tsx
index 54b47a01..13c9768a 100644
--- a/src/components/pages/filesytem/Filesystem.tsx
+++ b/src/components/pages/filesytem/Filesystem.tsx
@@ -1,11 +1,11 @@
-import React, { ReactElement } from "react";
-import FileList from "./FileList";
-import { ApiActionsInfo } from "./ApiActionsInfo";
-import UploadZone from "./upload/UploadZone";
+import React, { ReactElement } from "react"
+import FileList from "./FileList"
+import { ApiActionsInfo } from "./ApiActionsInfo"
+import UploadZone from "./upload/UploadZone"
-export const filesBaseUrl = "/file";
+export const filesBaseUrl = "/file"
-type Props = {};
+type Props = {}
function FileSystem(props: Props): ReactElement {
return (
@@ -25,7 +25,7 @@ function FileSystem(props: Props): ReactElement {
- );
+ )
}
-export default FileSystem;
+export default FileSystem
diff --git a/src/components/pages/filesytem/SelectedFsEntities.tsx b/src/components/pages/filesytem/SelectedFsEntities.tsx
index 54ca22ef..ba3af6c2 100644
--- a/src/components/pages/filesytem/SelectedFsEntities.tsx
+++ b/src/components/pages/filesytem/SelectedFsEntities.tsx
@@ -1,26 +1,26 @@
-import { SystemState } from "../../../background/redux/actions/sytemState";
-import { connect, ConnectedProps } from "react-redux";
-import React, { ReactElement } from "react";
-import { OverlayTrigger, Tooltip } from "react-bootstrap";
-import { FsEntity } from "../../../background/api/filesystemTypes";
-import { clearSelected } from "../../../background/redux/actions/filesystem";
+import { SystemState } from "../../../background/redux/actions/sytemState"
+import { connect, ConnectedProps } from "react-redux"
+import React, { ReactElement } from "react"
+import { OverlayTrigger, Tooltip } from "react-bootstrap"
+import { FsEntity } from "../../../background/api/filesystemTypes"
+import { clearSelected } from "../../../background/redux/actions/filesystem"
const mapState = (state: SystemState) => ({
- selectedFsEntities: state.filesystem.selectedFsEntities
-});
+ selectedFsEntities: state.filesystem.selectedFsEntities,
+})
const mapDispatch = {
- clearSelected
-};
+ clearSelected,
+}
-const connector = connect(mapState, mapDispatch);
+const connector = connect(mapState, mapDispatch)
-type PropsFromRedux = ConnectedProps;
+type PropsFromRedux = ConnectedProps
-type Props = PropsFromRedux & {};
+type Props = PropsFromRedux & {}
function SelectedFsEntities(props: Props): ReactElement {
- if (props.selectedFsEntities?.length < 1) return {};
+ if (props.selectedFsEntities?.length < 1) return {}
return (
@@ -39,7 +39,7 @@ function SelectedFsEntities(props: Props): ReactElement {
>
{e.path}
- );
+ )
})}
@@ -73,7 +73,7 @@ function SelectedFsEntities(props: Props): ReactElement {
- );
+ )
}
-export default connector(SelectedFsEntities);
+export default connector(SelectedFsEntities)
diff --git a/src/components/pages/filesytem/ToolbarActions.tsx b/src/components/pages/filesytem/ToolbarActions.tsx
index 0b105331..22dfc982 100644
--- a/src/components/pages/filesytem/ToolbarActions.tsx
+++ b/src/components/pages/filesytem/ToolbarActions.tsx
@@ -1,27 +1,27 @@
-import React, { ReactElement } from "react";
-import { Button, Fade } from "react-bootstrap";
-import { SystemState } from "../../../background/redux/actions/sytemState";
-import { connect, ConnectedProps } from "react-redux";
-import { deleteFsEntities } from "../../../background/api/filesystem";
-import { constants } from "../../../background/constants";
-import { FsEntity } from "../../../background/api/filesystemTypes";
-import { NewFolder } from "./upload/NewFolder";
-import { Search } from "./search/Search";
+import React, { ReactElement } from "react"
+import { Button, Fade } from "react-bootstrap"
+import { SystemState } from "../../../background/redux/actions/sytemState"
+import { connect, ConnectedProps } from "react-redux"
+import { deleteFsEntities } from "../../../background/api/filesystem"
+import { constants } from "../../../background/constants"
+import { FsEntity } from "../../../background/api/filesystemTypes"
+import { NewFolder } from "./upload/NewFolder"
+import { Search } from "./search/Search"
const mapState = (state: SystemState) => ({
selectedFsEntities: state.filesystem.selectedFsEntities,
- currentFsItemId: state.filesystem.currentFsItemId
-});
+ currentFsItemId: state.filesystem.currentFsItemId,
+})
-const connector = connect(mapState);
+const connector = connect(mapState)
-type PropsFromRedux = ConnectedProps;
+type PropsFromRedux = ConnectedProps
-type Props = PropsFromRedux & {};
+type Props = PropsFromRedux & {}
function ToolbarActions(props: Props): ReactElement | null {
function handleDeleteClicked() {
- deleteFsEntities(props.selectedFsEntities);
+ deleteFsEntities(props.selectedFsEntities)
}
return (
@@ -69,7 +69,7 @@ function ToolbarActions(props: Props): ReactElement | null {
- );
+ )
}
-export default connector(ToolbarActions);
+export default connector(ToolbarActions)
diff --git a/src/components/pages/filesytem/__tests__/FilesBreadcrumb.test.tsx b/src/components/pages/filesytem/__tests__/FilesBreadcrumb.test.tsx
index 996df916..df08d53b 100644
--- a/src/components/pages/filesytem/__tests__/FilesBreadcrumb.test.tsx
+++ b/src/components/pages/filesytem/__tests__/FilesBreadcrumb.test.tsx
@@ -1,14 +1,14 @@
-import { render } from "@testing-library/react";
-import React from "react";
-import { FilesBreadcrumb } from "../FilesBreadcrumb";
-import { Wrapper } from "../../../../dev/testUtils/Wrapper";
+import { render } from "@testing-library/react"
+import React from "react"
+import { FilesBreadcrumb } from "../FilesBreadcrumb"
+import { Wrapper } from "../../../../dev/testUtils/Wrapper"
test("renders path Breadcrumb", () => {
const breadcrumb = render(
- );
+ )
- expect(breadcrumb).toMatchSnapshot();
-});
+ expect(breadcrumb).toMatchSnapshot()
+})
diff --git a/src/components/pages/filesytem/fileIcon/FileIcon.tsx b/src/components/pages/filesytem/fileIcon/FileIcon.tsx
index 1d18341f..c0056588 100644
--- a/src/components/pages/filesytem/fileIcon/FileIcon.tsx
+++ b/src/components/pages/filesytem/fileIcon/FileIcon.tsx
@@ -1,51 +1,51 @@
-import React, { ReactElement } from "react";
+import React, { ReactElement } from "react"
import {
FileEarmarkIcon,
FileEarmarkImageIcon,
FileEarmarkMusicIcon,
- FolderIcon
-} from "../../../../assets/images/icons/reactSvgIcons/SymbolFile";
-import { getFileExtension } from "../../../../background/methods/filesystem";
-import FileIconApplication from "./FileIconApplication";
-import FileIconText from "./FileIconText";
-import FileIconVideo from "./FileIconVideo";
+ FolderIcon,
+} from "../../../../assets/images/icons/reactSvgIcons/SymbolFile"
+import { getFileExtension } from "../../../../background/methods/filesystem"
+import FileIconApplication from "./FileIconApplication"
+import FileIconText from "./FileIconText"
+import FileIconVideo from "./FileIconVideo"
export interface IconPreferencesInterface {
- height: string;
- width: string;
- color: string;
+ height: string
+ width: string
+ color: string
}
const ICON_PREFERENCES: IconPreferencesInterface = {
height: "40px",
width: "100%",
- color: "secondary"
-};
+ color: "secondary",
+}
export interface FileIconInterface {
- type: string;
- mimeType: string;
- name: string;
+ type: string
+ mimeType: string
+ name: string
}
function FileIcon(props: FileIconInterface): ReactElement {
//https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types
- const { type, name } = props;
+ const { type, name } = props
if (type.toUpperCase() === "FOLDER")
- return ;
+ return
if (getFileExtension(name) === "")
- return ;
+ return
switch (type.toLowerCase()) {
case "folder":
- return ;
+ return
case "text":
- return ;
+ return
case "image":
- return ;
+ return
case "video":
- return ;
+ return
case "audio":
- return ;
+ return
case "application":
default:
return (
@@ -53,8 +53,8 @@ function FileIcon(props: FileIconInterface): ReactElement {
ICON_PREFERENCES={ICON_PREFERENCES}
FileInformation={props}
/>
- );
+ )
}
}
-export default FileIcon;
+export default FileIcon
diff --git a/src/components/pages/filesytem/fileIcon/FileIconApplication.tsx b/src/components/pages/filesytem/fileIcon/FileIconApplication.tsx
index f42d8c7d..cc93b069 100644
--- a/src/components/pages/filesytem/fileIcon/FileIconApplication.tsx
+++ b/src/components/pages/filesytem/fileIcon/FileIconApplication.tsx
@@ -1,6 +1,6 @@
-import React from "react";
-import { FileIconInterface, IconPreferencesInterface } from "./FileIcon";
-import { getFileExtension } from "../../../../background/methods/filesystem";
+import React from "react"
+import { FileIconInterface, IconPreferencesInterface } from "./FileIcon"
+import { getFileExtension } from "../../../../background/methods/filesystem"
import {
FileEarmarkBinaryIcon,
FileEarmarkCodeIcon,
@@ -8,15 +8,15 @@ import {
FileEarmarkLock2Icon,
FileEarmarkPDFIcon,
FileEarmarkRichtextIcon,
- FileEarmarkZipIcon
-} from "../../../../assets/images/icons/reactSvgIcons/SymbolFile";
-import FileIconVideo from "./FileIconVideo";
+ FileEarmarkZipIcon,
+} from "../../../../assets/images/icons/reactSvgIcons/SymbolFile"
+import FileIconVideo from "./FileIconVideo"
export default function FileIconApplication(props: {
- ICON_PREFERENCES: IconPreferencesInterface;
- FileInformation: FileIconInterface;
+ ICON_PREFERENCES: IconPreferencesInterface
+ FileInformation: FileIconInterface
}) {
- const { ICON_PREFERENCES, FileInformation } = props;
+ const { ICON_PREFERENCES, FileInformation } = props
// console.log("-------------------------");
// console.log(getFileExtension(FileInformation.name.toLowerCase()));
// console.table(FileInformation);
@@ -30,30 +30,30 @@ export default function FileIconApplication(props: {
case "webm":
case "3gp":
case "3g2":
- return ;
+ return
case "java":
case "jsx":
case "ts":
case "tsx":
- return ;
+ return
case "crypt":
- return ;
+ return
case "md":
- return ;
+ return
case "pdf":
- return ;
+ return
case "7z":
case "zip":
- return ;
+ return
default: {
if (
FileInformation.mimeType.toLowerCase() ===
"application/octet-stream"
) {
//mime default type
- return ;
+ return
}
- return ;
+ return
}
}
}
diff --git a/src/components/pages/filesytem/fileIcon/FileIconText.tsx b/src/components/pages/filesytem/fileIcon/FileIconText.tsx
index 0215a38d..6cd09f99 100644
--- a/src/components/pages/filesytem/fileIcon/FileIconText.tsx
+++ b/src/components/pages/filesytem/fileIcon/FileIconText.tsx
@@ -1,14 +1,14 @@
-import React from "react";
+import React from "react"
import FileIcon, {
FileIconInterface,
- IconPreferencesInterface
-} from "./FileIcon";
-import { getFileExtension } from "../../../../background/methods/filesystem";
+ IconPreferencesInterface,
+} from "./FileIcon"
+import { getFileExtension } from "../../../../background/methods/filesystem"
import {
FileEarmarkCodeIcon,
FileEarmarkRichtextIcon,
- FileEarmarkTextIcon
-} from "../../../../assets/images/icons/reactSvgIcons/SymbolFile";
+ FileEarmarkTextIcon,
+} from "../../../../assets/images/icons/reactSvgIcons/SymbolFile"
export default function FileIconText(
ICON_PREFERENCES: IconPreferencesInterface,
@@ -21,10 +21,10 @@ export default function FileIconText(
case "jsx":
case "ts":
case "tsx":
- return ;
+ return
case "html":
- return ;
+ return
default:
- return ;
+ return
}
}
diff --git a/src/components/pages/filesytem/fileIcon/FileIconVideo.tsx b/src/components/pages/filesytem/fileIcon/FileIconVideo.tsx
index 18ab801a..115f8e59 100644
--- a/src/components/pages/filesytem/fileIcon/FileIconVideo.tsx
+++ b/src/components/pages/filesytem/fileIcon/FileIconVideo.tsx
@@ -1,9 +1,9 @@
-import React, { ReactElement } from "react";
-import { FileEarmarkPlayIcon } from "../../../../assets/images/icons/reactSvgIcons/SymbolFile";
-import { IconPreferencesInterface } from "./FileIcon";
+import React, { ReactElement } from "react"
+import { FileEarmarkPlayIcon } from "../../../../assets/images/icons/reactSvgIcons/SymbolFile"
+import { IconPreferencesInterface } from "./FileIcon"
export default function FileIconVideo(
ICON_PREFERENCES: IconPreferencesInterface
): ReactElement {
- return ;
+ return
}
diff --git a/src/components/pages/filesytem/fileListSize.ts b/src/components/pages/filesytem/fileListSize.ts
index 30bf3736..d1edd6f0 100644
--- a/src/components/pages/filesytem/fileListSize.ts
+++ b/src/components/pages/filesytem/fileListSize.ts
@@ -1,51 +1,51 @@
interface tableSizesInterface {
- checkbox: tableSizeElementInterface;
- icon: tableSizeElementInterface;
- contextMenu: tableSizeElementInterface;
- name: tableSizeElementInterface;
- modifiedBy: tableSizeElementInterface;
- modifiedOn: tableSizeElementInterface;
- size: tableSizeElementInterface;
- border: { xs: number };
+ checkbox: tableSizeElementInterface
+ icon: tableSizeElementInterface
+ contextMenu: tableSizeElementInterface
+ name: tableSizeElementInterface
+ modifiedBy: tableSizeElementInterface
+ modifiedOn: tableSizeElementInterface
+ size: tableSizeElementInterface
+ border: { xs: number }
}
interface tableSizeElementInterface {
- xs: number;
- md: number;
+ xs: number
+ md: number
}
const tableSizes: tableSizesInterface = {
checkbox: {
xs: 2,
- md: 1
+ md: 1,
},
icon: {
xs: 2,
- md: 1
+ md: 1,
},
contextMenu: {
xs: 2,
- md: 1
+ md: 1,
},
name: {
xs: 6,
- md: 4
+ md: 4,
},
modifiedBy: {
xs: 6,
- md: 3
+ md: 3,
},
modifiedOn: {
xs: 3,
- md: 1
+ md: 1,
},
size: {
xs: 3,
- md: 1
+ md: 1,
},
border: {
- xs: 12
- }
-};
+ xs: 12,
+ },
+}
-export default tableSizes;
+export default tableSizes
diff --git a/src/components/pages/filesytem/search/Search.tsx b/src/components/pages/filesytem/search/Search.tsx
index 64cdb71c..588895be 100644
--- a/src/components/pages/filesytem/search/Search.tsx
+++ b/src/components/pages/filesytem/search/Search.tsx
@@ -1,11 +1,11 @@
-import React, { ReactElement, useState } from "react";
-import { Button, Modal } from "react-bootstrap";
-import { SearchModalContent } from "./SearchModalContent";
+import React, { ReactElement, useState } from "react"
+import { Button, Modal } from "react-bootstrap"
+import { SearchModalContent } from "./SearchModalContent"
function Search(): ReactElement {
- const [showModal, setShowModal] = useState(false);
- const handleClose = () => setShowModal(false);
- const handleShow = () => setShowModal(true);
+ const [showModal, setShowModal] = useState(false)
+ const handleClose = () => setShowModal(false)
+ const handleShow = () => setShowModal(true)
return (
<>
@@ -27,7 +27,7 @@ function Search(): ReactElement {
>
- );
+ )
}
-export { Search };
+export { Search }
diff --git a/src/components/pages/filesytem/search/SearchModalContent.stories.tsx b/src/components/pages/filesytem/search/SearchModalContent.stories.tsx
index 6cd7dbd0..4749faba 100644
--- a/src/components/pages/filesytem/search/SearchModalContent.stories.tsx
+++ b/src/components/pages/filesytem/search/SearchModalContent.stories.tsx
@@ -1,19 +1,19 @@
-import { storiesOf } from "@storybook/react";
-import { Provider } from "react-redux";
-import store from "../../../../background/redux/store";
-import { BrowserRouter } from "react-router-dom";
-import React from "react";
-import { SearchModalContent } from "./SearchModalContent";
-import MockAdapter from "axios-mock-adapter";
-import axios from "axios";
-import folderContentMock from "../__tests__/folderContentMock.json";
-import { filesystemPath, hostname } from "../../../../background/api/api";
+import { storiesOf } from "@storybook/react"
+import { Provider } from "react-redux"
+import store from "../../../../background/redux/store"
+import { BrowserRouter } from "react-router-dom"
+import React from "react"
+import { SearchModalContent } from "./SearchModalContent"
+import MockAdapter from "axios-mock-adapter"
+import axios from "axios"
+import folderContentMock from "../__tests__/folderContentMock.json"
+import { filesystemPath, hostname } from "../../../../background/api/api"
-const API_REQUEST = hostname + filesystemPath + "search";
+const API_REQUEST = hostname + filesystemPath + "search"
storiesOf("Filesystem", module).add("SearchModal", () => {
- const mock = new MockAdapter(axios);
- mock.onGet(API_REQUEST).reply(200, folderContentMock);
+ const mock = new MockAdapter(axios)
+ mock.onGet(API_REQUEST).reply(200, folderContentMock)
return (
@@ -21,5 +21,5 @@ storiesOf("Filesystem", module).add("SearchModal", () => {
{}} />
- );
-});
+ )
+})
diff --git a/src/components/pages/filesytem/search/SearchModalContent.tsx b/src/components/pages/filesytem/search/SearchModalContent.tsx
index beab36fc..3312f7f5 100644
--- a/src/components/pages/filesytem/search/SearchModalContent.tsx
+++ b/src/components/pages/filesytem/search/SearchModalContent.tsx
@@ -1,76 +1,74 @@
-import React, { ReactElement, useEffect, useRef, useState } from "react";
-import { Form, Modal } from "react-bootstrap";
-import { FsEntity } from "../../../../background/api/filesystemTypes";
-import { searchFsEntities } from "../../../../background/api/filesystem";
-import SearchResult from "./SearchResult";
-import { FFLoading } from "../../../basicElements/Loading";
+import React, { ReactElement, useEffect, useRef, useState } from "react"
+import { Form, Modal } from "react-bootstrap"
+import { FsEntity } from "../../../../background/api/filesystemTypes"
+import { searchFsEntities } from "../../../../background/api/filesystem"
+import SearchResult from "./SearchResult"
+import { FFLoading } from "../../../basicElements/Loading"
interface Props {
- handleClose: () => void;
+ handleClose: () => void
}
function SearchModalContent({ handleClose }: Props): ReactElement {
- const [searchValue, setSearchValue] = useState("");
- const [searchResult, setSearchResult] = useState([]);
- const [requestOngoing, setRequestOngoing] = useState(false);
- const [lastRequestValue, setLastRequestValue] = useState("");
- const [error, setError] = useState("");
+ const [searchValue, setSearchValue] = useState("")
+ const [searchResult, setSearchResult] = useState([])
+ const [requestOngoing, setRequestOngoing] = useState(false)
+ const [lastRequestValue, setLastRequestValue] = useState("")
+ const [error, setError] = useState("")
- const inputElement = useRef(null);
+ const inputElement = useRef(null)
useEffect(() => {
- inputElement?.current?.focus();
- }, []);
+ inputElement?.current?.focus()
+ }, [])
useEffect(() => {
function refreshSearch(newValue: string) {
if (!requestOngoing && lastRequestValue !== newValue) {
- setRequestOngoing(true);
+ setRequestOngoing(true)
searchFsEntities(newValue)
.then((response) => {
- setSearchResult(response.data);
- setLastRequestValue(newValue);
- setRequestOngoing(false);
- setError("");
+ setSearchResult(response.data)
+ setLastRequestValue(newValue)
+ setRequestOngoing(false)
+ setError("")
})
.catch((error) => {
- setLastRequestValue(newValue);
- setRequestOngoing(false);
- setError(
- error.data?.message ?? "Something went wrong."
- );
- });
+ setLastRequestValue(newValue)
+ setRequestOngoing(false)
+ setError(error.data?.message ?? "Something went wrong.")
+ })
}
}
if (searchValue !== lastRequestValue && !requestOngoing) {
- refreshSearch(searchValue);
- return;
+ refreshSearch(searchValue)
+ return
}
- }, [searchValue, lastRequestValue, requestOngoing]);
+ }, [searchValue, lastRequestValue, requestOngoing])
const updateSearchValue = (event: React.ChangeEvent) => {
- const newValue = event.target.value;
- setSearchValue(newValue);
- };
+ const newValue = event.target.value
+ setSearchValue(newValue)
+ }
- console.log(searchResult);
+ console.log(searchResult)
function SearchModalBody() {
if (requestOngoing) {
- return ;
+ return
}
if (error) {
- return error;
+ return error
}
if (!searchValue) {
- return "Enter something";
+ return "Enter something"
}
if (searchResult.length === 0) {
- return "Nothing found.";
+ return "Nothing found."
}
return searchResult?.map((fsEntity: FsEntity) => (
- ));
+ ))
}
return (
@@ -98,7 +96,7 @@ function SearchModalContent({ handleClose }: Props): ReactElement {
{SearchModalBody()}
>
- );
+ )
}
-export { SearchModalContent };
+export { SearchModalContent }
diff --git a/src/components/pages/filesytem/search/SearchResult.tsx b/src/components/pages/filesytem/search/SearchResult.tsx
index 5b1e91bc..85681d4d 100644
--- a/src/components/pages/filesytem/search/SearchResult.tsx
+++ b/src/components/pages/filesytem/search/SearchResult.tsx
@@ -1,18 +1,18 @@
-import { FsEntity } from "../../../../background/api/filesystemTypes";
-import React, { ReactElement } from "react";
-import { Link } from "react-router-dom";
-import { Col, Row } from "react-bootstrap";
-import { getPathWithoutName } from "../../../../background/methods/filesystem";
-import FileIcon from "../fileIcon/FileIcon";
-import FileItemContextMenu from "../FileItemContextMenu";
+import { FsEntity } from "../../../../background/api/filesystemTypes"
+import React, { ReactElement } from "react"
+import { Link } from "react-router-dom"
+import { Col, Row } from "react-bootstrap"
+import { getPathWithoutName } from "../../../../background/methods/filesystem"
+import FileIcon from "../fileIcon/FileIcon"
+import FileItemContextMenu from "../FileItemContextMenu"
interface Props {
- fsEntity: FsEntity;
- handleClose: () => void;
+ fsEntity: FsEntity
+ handleClose: () => void
}
function SearchResult({ fsEntity, handleClose }: Props): ReactElement {
- const pathWithoutName = getPathWithoutName(fsEntity.path, fsEntity.name);
+ const pathWithoutName = getPathWithoutName(fsEntity.path, fsEntity.name)
return (
@@ -41,7 +41,7 @@ function SearchResult({ fsEntity, handleClose }: Props): ReactElement {
- );
+ )
}
-export default SearchResult;
+export default SearchResult
diff --git a/src/components/pages/filesytem/sortFilesAndFolders.ts b/src/components/pages/filesytem/sortFilesAndFolders.ts
index e11ad186..22f165ae 100644
--- a/src/components/pages/filesytem/sortFilesAndFolders.ts
+++ b/src/components/pages/filesytem/sortFilesAndFolders.ts
@@ -1,7 +1,7 @@
import {
FsEntity,
- PermissionSet
-} from "../../../background/api/filesystemTypes";
+ PermissionSet,
+} from "../../../background/api/filesystemTypes"
function mergeObjectArraysByProperty(
leftArray: any,
@@ -9,7 +9,7 @@ function mergeObjectArraysByProperty(
propertyName: keyof FsEntity,
sortIncreasing: boolean
): FsEntity[] {
- let arr: any = [];
+ let arr: any = []
// Break out of loop if any one of the array gets empty
while (leftArray.length && rightArray.length) {
// Pick the smaller among the smallest element of left and right sub arrays
@@ -19,18 +19,18 @@ function mergeObjectArraysByProperty(
rightArray[0][propertyName] === undefined ||
!rightArray[0].hasOwnProperty(propertyName)
) {
- let help: FsEntity | undefined = leftArray.shift();
- if (help) arr.push(help);
- continue;
+ let help: FsEntity | undefined = leftArray.shift()
+ if (help) arr.push(help)
+ continue
}
if (
leftArray[0] === undefined ||
leftArray[0][propertyName] === undefined ||
!leftArray[0].hasOwnProperty(propertyName)
) {
- let help: FsEntity | undefined = rightArray.shift();
- if (help) arr.push(help);
- continue;
+ let help: FsEntity | undefined = rightArray.shift()
+ if (help) arr.push(help)
+ continue
}
//at this point both elements should have property
@@ -39,33 +39,33 @@ function mergeObjectArraysByProperty(
| number
| boolean
| PermissionSet
- | undefined = leftArray[0][propertyName];
+ | undefined = leftArray[0][propertyName]
let firstRightElement:
| string
| number
| boolean
| PermissionSet
- | undefined = rightArray[0][propertyName];
+ | undefined = rightArray[0][propertyName]
if (typeof firstLeftElement === "string")
- firstLeftElement = firstLeftElement.toLowerCase();
+ firstLeftElement = firstLeftElement.toLowerCase()
if (typeof firstRightElement === "string")
- firstRightElement = firstRightElement.toLowerCase();
+ firstRightElement = firstRightElement.toLowerCase()
if (
firstLeftElement !== undefined &&
firstRightElement !== undefined &&
firstLeftElement <= firstRightElement &&
sortIncreasing
) {
- let help: FsEntity | undefined = leftArray.shift();
- if (help) arr.push(help);
- continue;
+ let help: FsEntity | undefined = leftArray.shift()
+ if (help) arr.push(help)
+ continue
}
- let help: FsEntity | undefined = rightArray.shift();
- if (help) arr.push(help);
+ let help: FsEntity | undefined = rightArray.shift()
+ if (help) arr.push(help)
}
// Concatenating leftover elements
- return [...arr, ...leftArray, ...rightArray];
+ return [...arr, ...leftArray, ...rightArray]
}
export function sortObjectsInArrayByProperty(
@@ -73,16 +73,16 @@ export function sortObjectsInArrayByProperty(
propertyName: keyof FsEntity,
sortIncreasing: boolean
): any {
- const array = [...originalArray];
- if (!array || array.length <= 1) return array ?? [];
+ const array = [...originalArray]
+ if (!array || array.length <= 1) return array ?? []
- const half = array.length / 2;
- const left = array.splice(0, half);
+ const half = array.length / 2
+ const left = array.splice(0, half)
return mergeObjectArraysByProperty(
sortObjectsInArrayByProperty(left, propertyName, sortIncreasing),
sortObjectsInArrayByProperty(array, propertyName, sortIncreasing),
propertyName,
sortIncreasing
- );
+ )
}
diff --git a/src/components/pages/filesytem/upload/NewFolder.tsx b/src/components/pages/filesytem/upload/NewFolder.tsx
index 0372a931..437d6b7b 100644
--- a/src/components/pages/filesytem/upload/NewFolder.tsx
+++ b/src/components/pages/filesytem/upload/NewFolder.tsx
@@ -1,20 +1,20 @@
-import { useSelector } from "react-redux";
-import React, { ReactElement, useState } from "react";
-import { RootState } from "../../../../background/redux/store";
-import { Button } from "react-bootstrap";
-import { Modal } from "react-bootstrap";
-import { NewFolderModalContent } from "./NewFolderModalContent";
+import { useSelector } from "react-redux"
+import React, { ReactElement, useState } from "react"
+import { RootState } from "../../../../background/redux/store"
+import { Button } from "react-bootstrap"
+import { Modal } from "react-bootstrap"
+import { NewFolderModalContent } from "./NewFolderModalContent"
function NewFolder(): ReactElement {
const currentFsItemId = useSelector(
(state: RootState) => state.filesystem.currentFsItemId
- );
- const [showModal, setShowModal] = useState(false);
- const handleClose = () => setShowModal(false);
- const handleShow = () => setShowModal(true);
+ )
+ const [showModal, setShowModal] = useState(false)
+ const handleClose = () => setShowModal(false)
+ const handleShow = () => setShowModal(true)
if (currentFsItemId === "-1") {
- return <>>;
+ return <>>
}
return (
@@ -38,7 +38,7 @@ function NewFolder(): ReactElement {
/>
>
- );
+ )
}
-export { NewFolder };
+export { NewFolder }
diff --git a/src/components/pages/filesytem/upload/NewFolderModalContent.stories.tsx b/src/components/pages/filesytem/upload/NewFolderModalContent.stories.tsx
index cf58b221..5e10f4e0 100644
--- a/src/components/pages/filesytem/upload/NewFolderModalContent.stories.tsx
+++ b/src/components/pages/filesytem/upload/NewFolderModalContent.stories.tsx
@@ -1,19 +1,19 @@
-import { storiesOf } from "@storybook/react";
-import { Provider } from "react-redux";
-import store from "../../../../background/redux/store";
-import { BrowserRouter } from "react-router-dom";
-import React from "react";
-import { NewFolderModalContent } from "./NewFolderModalContent";
-import { filesystemPath, hostname } from "../../../../background/api/api";
-import MockAdapter from "axios-mock-adapter";
-import axios from "axios";
-import folderContentMock from "../__tests__/folderContentMock.json";
+import { storiesOf } from "@storybook/react"
+import { Provider } from "react-redux"
+import store from "../../../../background/redux/store"
+import { BrowserRouter } from "react-router-dom"
+import React from "react"
+import { NewFolderModalContent } from "./NewFolderModalContent"
+import { filesystemPath, hostname } from "../../../../background/api/api"
+import MockAdapter from "axios-mock-adapter"
+import axios from "axios"
+import folderContentMock from "../__tests__/folderContentMock.json"
storiesOf("Filesystem", module).add("NewFolderModal", () => {
- const API_REQUEST = hostname + filesystemPath + "2/folder/create";
+ const API_REQUEST = hostname + filesystemPath + "2/folder/create"
- const mock = new MockAdapter(axios);
- mock.onPost(API_REQUEST).reply(200, folderContentMock[0]);
+ const mock = new MockAdapter(axios)
+ mock.onPost(API_REQUEST).reply(200, folderContentMock[0])
return (
@@ -24,5 +24,5 @@ storiesOf("Filesystem", module).add("NewFolderModal", () => {
/>
- );
-});
+ )
+})
diff --git a/src/components/pages/filesytem/upload/NewFolderModalContent.tsx b/src/components/pages/filesytem/upload/NewFolderModalContent.tsx
index 66d26987..e4e41d6c 100644
--- a/src/components/pages/filesytem/upload/NewFolderModalContent.tsx
+++ b/src/components/pages/filesytem/upload/NewFolderModalContent.tsx
@@ -1,44 +1,44 @@
-import { Button, Form, Modal, Row } from "react-bootstrap";
-import React, { FormEvent, useEffect, useRef, useState } from "react";
-import { createNewFolder } from "../../../../background/api/filesystem";
-import { isFileNameValid } from "../../../../background/methods/filesystem";
-import { useDispatch } from "react-redux";
-import { addToContents } from "../../../../background/redux/actions/filesystem";
+import { Button, Form, Modal, Row } from "react-bootstrap"
+import React, { FormEvent, useEffect, useRef, useState } from "react"
+import { createNewFolder } from "../../../../background/api/filesystem"
+import { isFileNameValid } from "../../../../background/methods/filesystem"
+import { useDispatch } from "react-redux"
+import { addToContents } from "../../../../background/redux/actions/filesystem"
interface Props {
- handleClose: () => void;
- currentFsItemId: string;
+ handleClose: () => void
+ currentFsItemId: string
}
function NewFolderModalContent({ handleClose, currentFsItemId }: Props) {
- const dispatch = useDispatch();
- const [folderName, setFolderName] = useState("");
- const [error, setError] = useState("");
+ const dispatch = useDispatch()
+ const [folderName, setFolderName] = useState("")
+ const [error, setError] = useState("")
- const inputElement = useRef(null);
+ const inputElement = useRef(null)
useEffect(() => {
- inputElement?.current?.focus();
- }, []);
+ inputElement?.current?.focus()
+ }, [])
function handleApply(event: FormEvent) {
- event.preventDefault();
- console.log("[NEW FOLDER ]", folderName);
+ event.preventDefault()
+ console.log("[NEW FOLDER ]", folderName)
if (!isFileNameValid(folderName)) {
- setError("The name is not a valid foldername.");
- return;
+ setError("The name is not a valid foldername.")
+ return
}
createNewFolder(folderName, currentFsItemId)
.then((response) => {
- dispatch(addToContents(response.data));
- setError("");
- handleClose();
+ dispatch(addToContents(response.data))
+ setError("")
+ handleClose()
})
.catch((error) => {
setError(
error.response?.data?.message ?? "Something went wrong :("
- );
- });
+ )
+ })
}
return (
@@ -71,7 +71,7 @@ function NewFolderModalContent({ handleClose, currentFsItemId }: Props) {
- );
+ )
}
-export { NewFolderModalContent };
+export { NewFolderModalContent }
diff --git a/src/components/pages/filesytem/upload/UploadDecisionsModalContent.stories.tsx b/src/components/pages/filesytem/upload/UploadDecisionsModalContent.stories.tsx
index fe2c985f..b983bf2b 100644
--- a/src/components/pages/filesytem/upload/UploadDecisionsModalContent.stories.tsx
+++ b/src/components/pages/filesytem/upload/UploadDecisionsModalContent.stories.tsx
@@ -1,14 +1,14 @@
-import { storiesOf } from "@storybook/react";
-import { Provider } from "react-redux";
-import store from "../../../../background/redux/store";
-import { BrowserRouter } from "react-router-dom";
-import React, { Reducer, useReducer } from "react";
-import { UploadDecisionsModalContent } from "./UploadDecisionsModalContent";
-import { preflightResultReducer } from "./UploadZone";
+import { storiesOf } from "@storybook/react"
+import { Provider } from "react-redux"
+import store from "../../../../background/redux/store"
+import { BrowserRouter } from "react-router-dom"
+import React, { Reducer, useReducer } from "react"
+import { UploadDecisionsModalContent } from "./UploadDecisionsModalContent"
+import { preflightResultReducer } from "./UploadZone"
import {
EditablePreflightEntityOrFile,
- PeflightEntiesActionTypes
-} from "./preflightTypes";
+ PeflightEntiesActionTypes,
+} from "./preflightTypes"
storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
const preflightResultInit: EditablePreflightEntityOrFile[] = [
@@ -18,7 +18,7 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
permissionIsSufficient: true, // can upload and can overwrite
nameAlreadyInUse: true,
nameIsValid: true,
- isFile: true
+ isFile: true,
},
{
name: "fasel",
@@ -26,7 +26,7 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
permissionIsSufficient: true, // can upload and can overwrite
nameAlreadyInUse: true,
nameIsValid: true,
- isFile: false
+ isFile: false,
},
{
name: "bla.wow",
@@ -34,7 +34,7 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
permissionIsSufficient: true, // can upload and can overwrite
nameAlreadyInUse: true,
nameIsValid: true,
- isFile: true
+ isFile: true,
},
{
name: "hallo.txt",
@@ -42,7 +42,7 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
permissionIsSufficient: true, // can upload and can overwrite
nameAlreadyInUse: true,
nameIsValid: true,
- isFile: true
+ isFile: true,
},
{
name: "blub",
@@ -50,7 +50,7 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
permissionIsSufficient: true, // can upload and can overwrite
nameAlreadyInUse: true,
nameIsValid: true,
- isFile: false
+ isFile: false,
},
{
name: "blubfdhjsgfhj---fsd/",
@@ -58,7 +58,7 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
permissionIsSufficient: true,
nameAlreadyInUse: false,
nameIsValid: false,
- isFile: false
+ isFile: false,
},
{
name: "notAllowed",
@@ -66,13 +66,13 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
permissionIsSufficient: false,
nameAlreadyInUse: false,
nameIsValid: true,
- isFile: false
- }
- ];
+ isFile: false,
+ },
+ ]
const [preflightResult, setPreflightResultDispatch] = useReducer<
Reducer
- >(preflightResultReducer, preflightResultInit);
+ >(preflightResultReducer, preflightResultInit)
return (
@@ -85,5 +85,5 @@ storiesOf("Filesystem", module).add("UploadDecisionsModal", () => {
/>
- );
-});
+ )
+})
diff --git a/src/components/pages/filesytem/upload/UploadDecisionsModalContent.tsx b/src/components/pages/filesytem/upload/UploadDecisionsModalContent.tsx
index 961edbba..f1176968 100644
--- a/src/components/pages/filesytem/upload/UploadDecisionsModalContent.tsx
+++ b/src/components/pages/filesytem/upload/UploadDecisionsModalContent.tsx
@@ -1,96 +1,96 @@
-import React, { ReactElement, useState } from "react";
-import { Button, Form, ListGroup, Modal, Row, Table } from "react-bootstrap";
-import UploadDecisionsTableRow from "./UploadDecisionsTableRow";
+import React, { ReactElement, useState } from "react"
+import { Button, Form, ListGroup, Modal, Row, Table } from "react-bootstrap"
+import UploadDecisionsTableRow from "./UploadDecisionsTableRow"
import {
EditableFileWithPreflightInfo,
EditablePreflightEntityOrFile,
PeflightEntiesActionTypes,
PREFLIGHT_ADD_ENTITIES,
PREFLIGHT_TOGGLE_ALL,
- PreflightEntity
-} from "./preflightTypes";
+ PreflightEntity,
+} from "./preflightTypes"
import {
uploadFiles,
- uploadPreflight
-} from "../../../../background/api/filesystem";
-import { preflightResultCombine } from "./preflightResponseParser";
-import { FFLoading } from "../../../basicElements/Loading";
+ uploadPreflight,
+} from "../../../../background/api/filesystem"
+import { preflightResultCombine } from "./preflightResponseParser"
+import { FFLoading } from "../../../basicElements/Loading"
interface Props {
- handleClose: () => void;
- preflightResult: EditablePreflightEntityOrFile[];
- setPreflightResultDispatch: (a: PeflightEntiesActionTypes) => void;
- fsItemIdToUpload: string;
+ handleClose: () => void
+ preflightResult: EditablePreflightEntityOrFile[]
+ setPreflightResultDispatch: (a: PeflightEntiesActionTypes) => void
+ fsItemIdToUpload: string
}
export const UploadDecisionsModalContent = ({
handleClose,
preflightResult,
setPreflightResultDispatch,
- fsItemIdToUpload
+ fsItemIdToUpload,
}: Props): ReactElement => {
- const [currentPage, setCurrentPage] = useState(0);
- const [showAllFiles, setShowAllFiles] = useState(false);
- const [showAllFolders, setShowAllFolders] = useState(false);
- const [loading, setLoading] = useState(false);
- const nextPage = () => setCurrentPage(currentPage + 1);
- const [selectAllFolders, setSelectAllFolders] = useState(false);
- const [selectAllFiles, setSelectAllFiles] = useState(false);
- const listLimitForFilesAndFolder = 2;
+ const [currentPage, setCurrentPage] = useState(0)
+ const [showAllFiles, setShowAllFiles] = useState(false)
+ const [showAllFolders, setShowAllFolders] = useState(false)
+ const [loading, setLoading] = useState(false)
+ const nextPage = () => setCurrentPage(currentPage + 1)
+ const [selectAllFolders, setSelectAllFolders] = useState(false)
+ const [selectAllFiles, setSelectAllFiles] = useState(false)
+ const listLimitForFilesAndFolder = 2
const updateSelectAll = (isFolder: boolean) => {
- let newValue;
+ let newValue
if (isFolder) {
- setSelectAllFolders(!selectAllFolders);
- newValue = !selectAllFolders;
+ setSelectAllFolders(!selectAllFolders)
+ newValue = !selectAllFolders
} else {
- setSelectAllFiles(!selectAllFiles);
- newValue = !selectAllFiles;
+ setSelectAllFiles(!selectAllFiles)
+ newValue = !selectAllFiles
}
setPreflightResultDispatch({
type: PREFLIGHT_TOGGLE_ALL,
- payload: { isFolders: isFolder, newValue: newValue }
- });
- };
+ payload: { isFolders: isFolder, newValue: newValue },
+ })
+ }
const handleApply = () => {
- setLoading(true);
+ setLoading(true)
uploadPreflight(
preflightResult.filter(
(e: EditablePreflightEntityOrFile) => e.isFile
) as EditableFileWithPreflightInfo[],
fsItemIdToUpload
).then((response: PreflightEntity[]) => {
- const combined = preflightResultCombine(preflightResult, response);
+ const combined = preflightResultCombine(preflightResult, response)
const actionsNeeded = combined.some(
(e: EditablePreflightEntityOrFile) =>
!e.permissionIsSufficient ||
!e.nameIsValid ||
(e.nameAlreadyInUse && !e.overwrite)
- );
+ )
if (actionsNeeded) {
setPreflightResultDispatch({
type: PREFLIGHT_ADD_ENTITIES,
- payload: combined
- });
+ payload: combined,
+ })
} else {
uploadFiles(
combined.filter(
(f: EditablePreflightEntityOrFile) => f.isFile
) as EditableFileWithPreflightInfo[],
fsItemIdToUpload
- );
- handleClose();
+ )
+ handleClose()
setPreflightResultDispatch({
type: PREFLIGHT_ADD_ENTITIES,
- payload: []
- });
+ payload: [],
+ })
}
- setLoading(false);
- });
- };
+ setLoading(false)
+ })
+ }
const handleOverWriteAll = () => {
uploadFiles(
@@ -98,26 +98,26 @@ export const UploadDecisionsModalContent = ({
(f: EditablePreflightEntityOrFile) => f.isFile
) as EditableFileWithPreflightInfo[],
fsItemIdToUpload
- );
- handleClose();
+ )
+ handleClose()
setPreflightResultDispatch({
type: PREFLIGHT_ADD_ENTITIES,
- payload: []
- });
- };
+ payload: [],
+ })
+ }
const foldersToMerge = preflightResult.filter(
(f: EditablePreflightEntityOrFile) => !f.isFile && f.nameAlreadyInUse
- );
+ )
const entitiesWithInvalidName = preflightResult.filter(
(f: EditablePreflightEntityOrFile) => !f.nameIsValid
- );
+ )
const filesToOverwrite = preflightResult.filter(
(f: EditablePreflightEntityOrFile) => f.isFile && f.nameAlreadyInUse
- );
+ )
const insufficientPermission = preflightResult.filter(
(f: EditablePreflightEntityOrFile) => !f.permissionIsSufficient
- );
+ )
const smallFileList = (files: EditablePreflightEntityOrFile[]) => {
return (
@@ -128,8 +128,8 @@ export const UploadDecisionsModalContent = ({
))}
- );
- };
+ )
+ }
const changeNamesOrOverwriteTable = (
files: EditablePreflightEntityOrFile[],
@@ -173,15 +173,15 @@ export const UploadDecisionsModalContent = ({
}
preflightEntity={f}
/>
- );
+ )
})}
- );
- };
+ )
+ }
if (loading) {
- return ;
+ return
}
if (currentPage === 0)
@@ -271,7 +271,7 @@ export const UploadDecisionsModalContent = ({
>
- );
+ )
else
return (
<>
@@ -303,7 +303,7 @@ export const UploadDecisionsModalContent = ({
{changeNamesOrOverwriteTable(
[
...entitiesWithInvalidName,
- ...insufficientPermission
+ ...insufficientPermission,
],
false
)}
@@ -326,5 +326,5 @@ export const UploadDecisionsModalContent = ({
>
- );
-};
+ )
+}
diff --git a/src/components/pages/filesytem/upload/UploadDecisionsTableRow.tsx b/src/components/pages/filesytem/upload/UploadDecisionsTableRow.tsx
index 3b0e19f1..aab09547 100644
--- a/src/components/pages/filesytem/upload/UploadDecisionsTableRow.tsx
+++ b/src/components/pages/filesytem/upload/UploadDecisionsTableRow.tsx
@@ -1,5 +1,5 @@
-import React, { useCallback } from "react";
-import { Form } from "react-bootstrap";
+import React, { useCallback } from "react"
+import { Form } from "react-bootstrap"
import {
EditablePreflightEntityOrFile,
PeflightEntiesActionTypes,
@@ -8,65 +8,65 @@ import {
PREFLIGHT_UPDATE_NAME,
PreflightChangeName,
PreflightToggleOverwrite,
- PreflightUpdateName
-} from "./preflightTypes";
+ PreflightUpdateName,
+} from "./preflightTypes"
interface Props {
- preflightEntity: EditablePreflightEntityOrFile;
- setPreflightResultDispatch: (a: PeflightEntiesActionTypes) => void;
+ preflightEntity: EditablePreflightEntityOrFile
+ setPreflightResultDispatch: (a: PeflightEntiesActionTypes) => void
}
const UploadDecisionsTableRow = ({
preflightEntity,
- setPreflightResultDispatch
+ setPreflightResultDispatch,
}: Props) => {
const onNameChange = useCallback(
(event: React.ChangeEvent) => {
- let val = event.target.value;
+ let val = event.target.value
const change: PreflightChangeName = {
type: PREFLIGHT_CHANGE_NAME,
payload: {
path: preflightEntity.path,
- newName: val
- }
- };
- setPreflightResultDispatch(change);
+ newName: val,
+ },
+ }
+ setPreflightResultDispatch(change)
},
[preflightEntity.path, setPreflightResultDispatch]
- );
+ )
const onNameInputLeaver = useCallback(
(event: React.ChangeEvent) => {
- console.log("onNameInputLeaver");
- let val = event.target.value;
+ console.log("onNameInputLeaver")
+ let val = event.target.value
const change: PreflightUpdateName = {
type: PREFLIGHT_UPDATE_NAME,
payload: {
path: preflightEntity.path,
- newName: val
- }
- };
- setPreflightResultDispatch(change);
+ newName: val,
+ },
+ }
+ setPreflightResultDispatch(change)
},
[preflightEntity.path, setPreflightResultDispatch]
- );
+ )
const onSelectedChange = useCallback(() => {
const change: PreflightToggleOverwrite = {
type: PREFLIGHT_TOGGLE_OVERWRITE,
payload: {
path: preflightEntity.path,
- overwrite: !preflightEntity.overwrite
- }
- };
- setPreflightResultDispatch(change);
- }, [preflightEntity, setPreflightResultDispatch]);
+ overwrite: !preflightEntity.overwrite,
+ },
+ }
+ setPreflightResultDispatch(change)
+ }, [preflightEntity, setPreflightResultDispatch])
let requiresNameChange =
(!preflightEntity.nameIsValid ||
(!preflightEntity.permissionIsSufficient &&
preflightEntity.overwrite)) &&
- !preflightEntity.newName;
+ !preflightEntity.newName
return (
@@ -115,7 +115,7 @@ const UploadDecisionsTableRow = ({
|
- );
-};
+ )
+}
-export default UploadDecisionsTableRow;
+export default UploadDecisionsTableRow
diff --git a/src/components/pages/filesytem/upload/UploadZone.tsx b/src/components/pages/filesytem/upload/UploadZone.tsx
index 12e1a07c..7d877ebe 100644
--- a/src/components/pages/filesytem/upload/UploadZone.tsx
+++ b/src/components/pages/filesytem/upload/UploadZone.tsx
@@ -3,24 +3,24 @@ import React, {
Reducer,
useCallback,
useReducer,
- useState
-} from "react";
-import { useDropzone } from "react-dropzone";
-import { useSelector } from "react-redux";
-import { RootState } from "../../../../background/redux/store";
-import { Modal } from "react-bootstrap";
+ useState,
+} from "react"
+import { useDropzone } from "react-dropzone"
+import { useSelector } from "react-redux"
+import { RootState } from "../../../../background/redux/store"
+import { Modal } from "react-bootstrap"
import {
uploadFiles,
- uploadPreflight
-} from "../../../../background/api/filesystem";
-import { FsEntity } from "../../../../background/api/filesystemTypes";
-import { UploadDecisionsModalContent } from "./UploadDecisionsModalContent";
-import { divideArrayByCondition } from "../../../../background/methods/dataTypes/arrays";
+ uploadPreflight,
+} from "../../../../background/api/filesystem"
+import { FsEntity } from "../../../../background/api/filesystemTypes"
+import { UploadDecisionsModalContent } from "./UploadDecisionsModalContent"
+import { divideArrayByCondition } from "../../../../background/methods/dataTypes/arrays"
import {
getPathWithoutName,
isFileNameValid,
- removeLeadingBackslash
-} from "../../../../background/methods/filesystem";
+ removeLeadingBackslash,
+} from "../../../../background/methods/filesystem"
import {
EditableEntityError,
EditableFileWithPreflightInfo,
@@ -31,33 +31,33 @@ import {
PREFLIGHT_TOGGLE_ALL,
PREFLIGHT_TOGGLE_OVERWRITE,
PREFLIGHT_UPDATE_NAME,
- PreflightEntity
-} from "./preflightTypes";
-import { preflightResultCombine } from "./preflightResponseParser";
+ PreflightEntity,
+} from "./preflightTypes"
+import { preflightResultCombine } from "./preflightResponseParser"
export const UploadZone = (): ReactElement => {
- const [showUploadDialog, setShowUploadDialog] = useState(false);
+ const [showUploadDialog, setShowUploadDialog] = useState(false)
const handleClose = () => {
setPreflightResultDispatch({
type: PREFLIGHT_ADD_ENTITIES,
- payload: []
- });
- setShowUploadDialog(false);
- };
- const handleShow = () => setShowUploadDialog(true);
+ payload: [],
+ })
+ setShowUploadDialog(false)
+ }
+ const handleShow = () => setShowUploadDialog(true)
const currentFsItemId = useSelector(
(state: RootState) => state.filesystem.currentFsItemId
- );
- const [fsItemIdToUpload, setFsItemIdToUpload] = useState(currentFsItemId);
+ )
+ const [fsItemIdToUpload, setFsItemIdToUpload] = useState(currentFsItemId)
const currentFsContent = useSelector(
(state: RootState) => state.filesystem.folderContents
- );
+ )
const onDrop = useCallback(
(acceptedFiles: EditableFileWithPreflightInfo[]) => {
if (!acceptedFiles.length) {
- return; // TODO: dispatch a action to show that a empty folder could not be uploaded
+ return // TODO: dispatch a action to show that a empty folder could not be uploaded
}
//check if preflight is needed
@@ -69,17 +69,17 @@ export const UploadZone = (): ReactElement => {
currentFsContent.some(
(fsEntiy: FsEntity) => fsEntiy.name === file.name
)
- );
+ )
}
- );
+ )
console.log(
"[Upload Zone, add files]",
acceptedFiles,
preflightNeeded
- );
+ )
if (preflightNeeded) {
- setFsItemIdToUpload(currentFsItemId);
+ setFsItemIdToUpload(currentFsItemId)
uploadPreflight(acceptedFiles, currentFsItemId).then(
(response) => {
const actionsNeeded = response.some(
@@ -87,51 +87,48 @@ export const UploadZone = (): ReactElement => {
!e.permissionIsSufficient ||
e.nameAlreadyInUse ||
!e.nameIsValid
- );
+ )
if (actionsNeeded) {
const combined = preflightResultCombine(
acceptedFiles,
response
- );
- console.log("combined", combined);
+ )
+ console.log("combined", combined)
setPreflightResultDispatch({
type: PREFLIGHT_ADD_ENTITIES,
payload: [
...combined,
- ...response.filter((f) => !f.isFile)
- ]
- });
- handleShow();
+ ...response.filter((f) => !f.isFile),
+ ],
+ })
+ handleShow()
} else {
uploadFiles(
- (acceptedFiles as unknown) as File[],
+ acceptedFiles as unknown as File[],
currentFsItemId
- );
+ )
}
}
- );
+ )
} else {
- uploadFiles(
- (acceptedFiles as unknown) as File[],
- currentFsItemId
- );
+ uploadFiles(acceptedFiles as unknown as File[], currentFsItemId)
}
},
[currentFsItemId, currentFsContent]
- );
+ )
const [preflightResult, setPreflightResultDispatch] = useReducer<
Reducer
- >(preflightResultReducer, []);
+ >(preflightResultReducer, [])
const { getRootProps, getInputProps, isDragActive } = useDropzone({
// @ts-ignore
- onDrop
- });
+ onDrop,
+ })
if (currentFsItemId === "-1") {
- return <>>;
+ return <>>
}
return (
<>
@@ -162,8 +159,8 @@ export const UploadZone = (): ReactElement => {
/>
>
- );
-};
+ )
+}
export const preflightResultReducer: Reducer<
EditablePreflightEntityOrFile[],
@@ -171,85 +168,85 @@ export const preflightResultReducer: Reducer<
> = (currentState, action) => {
switch (action.type) {
case PREFLIGHT_ADD_ENTITIES: {
- return action.payload.sort(sortPreflightResult);
+ return action.payload.sort(sortPreflightResult)
}
case PREFLIGHT_TOGGLE_ALL: {
let [files, folders] = divideArrayByCondition(
currentState,
(e) => e.isFile
- );
- let toChange = action.payload.isFolders ? folders : files;
- let notToChange = !action.payload.isFolders ? folders : files;
+ )
+ let toChange = action.payload.isFolders ? folders : files
+ let notToChange = !action.payload.isFolders ? folders : files
toChange = toChange.map((e: EditablePreflightEntityOrFile) => {
if (e.nameIsValid && e.permissionIsSufficient) {
- e.overwrite = action.payload?.newValue ?? false;
+ e.overwrite = action.payload?.newValue ?? false
}
- return e;
- });
- return [...toChange, ...notToChange].sort(sortPreflightResult);
+ return e
+ })
+ return [...toChange, ...notToChange].sort(sortPreflightResult)
}
case PREFLIGHT_TOGGLE_OVERWRITE: {
let [[elementToReplace], restOfElements] = divideArrayByCondition(
currentState,
(e) => e.path === action.payload.path
- );
- elementToReplace.overwrite = action.payload.overwrite;
+ )
+ elementToReplace.overwrite = action.payload.overwrite
return [...restOfElements, elementToReplace].sort(
sortPreflightResult
- );
+ )
}
case PREFLIGHT_CHANGE_NAME: {
let [[elementToReplace], restOfElements] = divideArrayByCondition(
currentState,
(e) => e.path === action.payload.path
- );
- let oldPath = elementToReplace.newPath ?? elementToReplace.path;
+ )
+ let oldPath = elementToReplace.newPath ?? elementToReplace.path
elementToReplace.newPath =
oldPath.substring(
0,
oldPath.lastIndexOf(
elementToReplace.newName ?? elementToReplace.name
)
- ) + action.payload.newName;
- elementToReplace.newName = action.payload.newName;
- elementToReplace.error = undefined;
+ ) + action.payload.newName
+ elementToReplace.newName = action.payload.newName
+ elementToReplace.error = undefined
return [...restOfElements, elementToReplace].sort(
sortPreflightResult
- );
+ )
}
case PREFLIGHT_UPDATE_NAME: {
let [[elementToReplace], restOfElements] = divideArrayByCondition(
currentState,
(e) => e.path === action.payload.path
- );
- let oldPath = elementToReplace.newPath ?? elementToReplace.path;
+ )
+ let oldPath = elementToReplace.newPath ?? elementToReplace.path
let newPath =
oldPath.substring(
0,
oldPath.lastIndexOf(
elementToReplace.newName ?? elementToReplace.name
)
- ) + action.payload.newName;
+ ) + action.payload.newName
let newPathAlreadyExits = restOfElements.some(
(e: EditablePreflightEntityOrFile) => {
- let localPath = e.newPath ?? e.path;
- return localPath === newPath;
+ let localPath = e.newPath ?? e.path
+ return localPath === newPath
}
- );
+ )
- let newNameIsNotValid = !isFileNameValid(action.payload.newName);
+ let newNameIsNotValid = !isFileNameValid(action.payload.newName)
if (newPathAlreadyExits || newNameIsNotValid) {
elementToReplace.error = newPathAlreadyExits
? EditableEntityError.ALREADYEXITS
- : EditableEntityError.INVALIDNAME;
+ : EditableEntityError.INVALIDNAME
elementToReplace.newPath =
- elementToReplace.prefNewPath ?? elementToReplace.path;
+ elementToReplace.prefNewPath ?? elementToReplace.path
elementToReplace.newName =
- elementToReplace.prefNewName ?? elementToReplace.name;
+ elementToReplace.prefNewName ?? elementToReplace.name
} else {
console.log(
"PREFLIGHT_UPDATE_NAME",
@@ -257,57 +254,57 @@ export const preflightResultReducer: Reducer<
elementToReplace.prefNewPath,
elementToReplace.path,
elementToReplace.newName
- );
+ )
let prevOldPath =
elementToReplace.prefNewPath ??
- removeLeadingBackslash(elementToReplace.path);
+ removeLeadingBackslash(elementToReplace.path)
restOfElements = restOfElements.map((e) => {
let currentPath =
- e.newPath ?? removeLeadingBackslash(e.path);
- let currentName = e.newName ?? e.name;
+ e.newPath ?? removeLeadingBackslash(e.path)
+ let currentName = e.newName ?? e.name
let currentPathWithoutName = getPathWithoutName(
currentPath,
currentName
- );
+ )
- let index = currentPathWithoutName.indexOf(prevOldPath);
+ let index = currentPathWithoutName.indexOf(prevOldPath)
- let pathNeedsChange = index === 0;
+ let pathNeedsChange = index === 0
console.log(
"PREFLIGHT_UPDATE_NAME",
prevOldPath,
currentPathWithoutName,
currentName
- );
+ )
if (pathNeedsChange) {
e.newPath =
newPath +
removeLeadingBackslash(currentPath).substr(
prevOldPath?.length
- );
- e.prefNewPath = e.newPath;
+ )
+ e.prefNewPath = e.newPath
}
- return e;
- });
- elementToReplace.prefNewPath = newPath;
- elementToReplace.prefNewName = action.payload.newName;
- elementToReplace.newPath = newPath;
- elementToReplace.newName = action.payload.newName;
- elementToReplace.error = undefined;
- console.log("updated");
+ return e
+ })
+ elementToReplace.prefNewPath = newPath
+ elementToReplace.prefNewName = action.payload.newName
+ elementToReplace.newPath = newPath
+ elementToReplace.newName = action.payload.newName
+ elementToReplace.error = undefined
+ console.log("updated")
}
return [...restOfElements, elementToReplace].sort(
sortPreflightResult
- );
+ )
}
}
-};
+}
const sortPreflightResult = (
a: EditablePreflightEntityOrFile,
b: EditablePreflightEntityOrFile
) => {
- return a.path.localeCompare(b.path);
-};
+ return a.path.localeCompare(b.path)
+}
-export default UploadZone;
+export default UploadZone
diff --git a/src/components/pages/filesytem/upload/preflightResponseParser.ts b/src/components/pages/filesytem/upload/preflightResponseParser.ts
index 05a58245..4f3eed17 100644
--- a/src/components/pages/filesytem/upload/preflightResponseParser.ts
+++ b/src/components/pages/filesytem/upload/preflightResponseParser.ts
@@ -1,29 +1,29 @@
import {
EditablePreflightEntityOrFile,
- PreflightEntity
-} from "./preflightTypes";
+ PreflightEntity,
+} from "./preflightTypes"
export const preflightResultCombine = (
files: EditablePreflightEntityOrFile[],
response: PreflightEntity[]
) => {
- console.log("[preflightResultCombine] files", files, "response", response);
+ console.log("[preflightResultCombine] files", files, "response", response)
return files.map((file: EditablePreflightEntityOrFile) => {
const resInfo = response.find(
(e) =>
e.path === (file.newPath ?? file.path) ||
"/" + e.path === (file.newPath ?? file.path)
- );
+ )
// could be done better if rest returned paths with leading slashes
if (!resInfo) {
- console.error("Did not found a response for the file:", file);
+ console.error("Did not found a response for the file:", file)
}
- file.permissionIsSufficient = resInfo?.permissionIsSufficient ?? true;
- file.nameAlreadyInUse = resInfo?.nameAlreadyInUse ?? false;
- file.nameIsValid = resInfo?.nameIsValid ?? true;
- file.isFile = resInfo?.isFile ?? false;
+ file.permissionIsSufficient = resInfo?.permissionIsSufficient ?? true
+ file.nameAlreadyInUse = resInfo?.nameAlreadyInUse ?? false
+ file.nameIsValid = resInfo?.nameIsValid ?? true
+ file.isFile = resInfo?.isFile ?? false
- return file;
- });
-};
+ return file
+ })
+}
diff --git a/src/components/pages/filesytem/upload/preflightTypes.ts b/src/components/pages/filesytem/upload/preflightTypes.ts
index eb28b6da..e3f63e17 100644
--- a/src/components/pages/filesytem/upload/preflightTypes.ts
+++ b/src/components/pages/filesytem/upload/preflightTypes.ts
@@ -1,22 +1,22 @@
export interface PreflightEntity {
- name: string;
- path: string;
- permissionIsSufficient: boolean; // can upload and can overwrite
- nameAlreadyInUse: boolean;
- nameIsValid: boolean;
- isFile: boolean;
+ name: string
+ path: string
+ permissionIsSufficient: boolean // can upload and can overwrite
+ nameAlreadyInUse: boolean
+ nameIsValid: boolean
+ isFile: boolean
}
export type EditablePreflightEntityOrFile =
| EditableFileWithPreflightInfo
- | EditablePreflightEntity;
+ | EditablePreflightEntity
export interface EditableFileWithPreflightInfo
extends File,
EditableEntity,
PreflightEntity {
- webkitRelativePath?: string;
- readonly name: string;
+ webkitRelativePath?: string
+ readonly name: string
}
export interface EditablePreflightEntity
@@ -24,17 +24,17 @@ export interface EditablePreflightEntity
EditableEntity {}
interface EditableEntity {
- newName?: string;
- newPath?: string;
- overwrite?: boolean;
- prefNewPath?: string;
- prefNewName?: string;
- error?: EditableEntityError;
+ newName?: string
+ newPath?: string
+ overwrite?: boolean
+ prefNewPath?: string
+ prefNewName?: string
+ error?: EditableEntityError
}
export enum EditableEntityError {
"ALREADYEXITS" = "Name already exits",
- "INVALIDNAME" = "Name is invalid"
+ "INVALIDNAME" = "Name is invalid",
}
export type PeflightEntiesActionTypes =
@@ -42,49 +42,49 @@ export type PeflightEntiesActionTypes =
| PreflightToggleOverwrite
| PreflightUpdateName
| PreflightToggleAll
- | PreflightAddEntities;
-export const PREFLIGHT_CHANGE_NAME = "PREFLIGHT_CHANGE_NAME";
-export const PREFLIGHT_TOGGLE_OVERWRITE = "PREFLIGHT_TOGGLE_OVERWRITE";
-export const PREFLIGHT_UPDATE_NAME = "PREFLIGHT_UPDATE_NAME";
-export const PREFLIGHT_TOGGLE_ALL = "PREFLIGHT_TOGGLE_ALL";
-export const PREFLIGHT_ADD_ENTITIES = "PREFLIGHT_ADD_ENTITIES";
+ | PreflightAddEntities
+export const PREFLIGHT_CHANGE_NAME = "PREFLIGHT_CHANGE_NAME"
+export const PREFLIGHT_TOGGLE_OVERWRITE = "PREFLIGHT_TOGGLE_OVERWRITE"
+export const PREFLIGHT_UPDATE_NAME = "PREFLIGHT_UPDATE_NAME"
+export const PREFLIGHT_TOGGLE_ALL = "PREFLIGHT_TOGGLE_ALL"
+export const PREFLIGHT_ADD_ENTITIES = "PREFLIGHT_ADD_ENTITIES"
export interface PreflightChangeName {
- type: typeof PREFLIGHT_CHANGE_NAME;
- payload: NameChangePayload;
+ type: typeof PREFLIGHT_CHANGE_NAME
+ payload: NameChangePayload
}
export interface PreflightToggleOverwrite {
- type: typeof PREFLIGHT_TOGGLE_OVERWRITE;
- payload: OverwriteTogglePayload;
+ type: typeof PREFLIGHT_TOGGLE_OVERWRITE
+ payload: OverwriteTogglePayload
}
export interface PreflightUpdateName {
- type: typeof PREFLIGHT_UPDATE_NAME;
- payload: NameChangePayload;
+ type: typeof PREFLIGHT_UPDATE_NAME
+ payload: NameChangePayload
}
export interface PreflightToggleAll {
- type: typeof PREFLIGHT_TOGGLE_ALL;
- payload: ToggleAllPayload;
+ type: typeof PREFLIGHT_TOGGLE_ALL
+ payload: ToggleAllPayload
}
export interface PreflightAddEntities {
- type: typeof PREFLIGHT_ADD_ENTITIES;
- payload: EditablePreflightEntityOrFile[];
+ type: typeof PREFLIGHT_ADD_ENTITIES
+ payload: EditablePreflightEntityOrFile[]
}
interface NameChangePayload {
- path: string;
- newName: string;
+ path: string
+ newName: string
}
interface OverwriteTogglePayload {
- path: string;
- overwrite: boolean;
+ path: string
+ overwrite: boolean
}
interface ToggleAllPayload {
- isFolders: boolean;
- newValue: boolean;
+ isFolders: boolean
+ newValue: boolean
}
diff --git a/src/components/pages/health/Health.stories.tsx b/src/components/pages/health/Health.stories.tsx
index d3666f6d..40c7c8cd 100644
--- a/src/components/pages/health/Health.stories.tsx
+++ b/src/components/pages/health/Health.stories.tsx
@@ -1,23 +1,23 @@
-import React from "react";
-import { storiesOf } from "@storybook/react";
-import { BrowserRouter } from "react-router-dom";
-import "../../../style/custom.scss";
-import Health from "./Health";
-import axios from "axios";
-import MockAdapter from "axios-mock-adapter";
-import { hostname } from "../../../background/api/api";
-import healthApiMock from "./__tests__/healthApiMock.json";
+import React from "react"
+import { storiesOf } from "@storybook/react"
+import { BrowserRouter } from "react-router-dom"
+import "../../../style/custom.scss"
+import Health from "./Health"
+import axios from "axios"
+import MockAdapter from "axios-mock-adapter"
+import { hostname } from "../../../background/api/api"
+import healthApiMock from "./__tests__/healthApiMock.json"
-const mock = new MockAdapter(axios);
+const mock = new MockAdapter(axios)
// 2.1 the api request to be intercepted has to match exactly
-const API_REQUEST = hostname + "/health";
+const API_REQUEST = hostname + "/health"
storiesOf("Health", module).add("default", () => {
- mock.onGet(API_REQUEST).reply(200, healthApiMock);
+ mock.onGet(API_REQUEST).reply(200, healthApiMock)
return (
- );
-});
+ )
+})
diff --git a/src/components/pages/health/Health.tsx b/src/components/pages/health/Health.tsx
index d7d793a0..d1a0a2d2 100644
--- a/src/components/pages/health/Health.tsx
+++ b/src/components/pages/health/Health.tsx
@@ -1,63 +1,63 @@
-import React, { useEffect, useState } from "react";
-import logo from "../../../assets/images/logos/logo.png";
-import { Container, OverlayTrigger, Table, Tooltip } from "react-bootstrap";
+import React, { useEffect, useState } from "react"
+import logo from "../../../assets/images/logos/logo.png"
+import { Container, OverlayTrigger, Table, Tooltip } from "react-bootstrap"
import {
callBackendHealth,
DataIntegrity,
- SystemHealthData
-} from "../../../background/api/api";
+ SystemHealthData,
+} from "../../../background/api/api"
import {
audioOnOff,
- setAudioVolumeByID
-} from "../../../background/methods/sound";
-import { getDurationAsString } from "../../../background/methods/dataTypes/time";
-import { hasKey } from "../../../background/methods/dataTypes/objects/ObjectKeysTS";
-import { formatBytes } from "../../../background/methods/dataTypes/bytes";
-import { FFLoading } from "../../basicElements/Loading";
-import traffic_light from "../../../assets/images/icons/material.io/traffic_light.svg";
+ setAudioVolumeByID,
+} from "../../../background/methods/sound"
+import { getDurationAsString } from "../../../background/methods/dataTypes/time"
+import { hasKey } from "../../../background/methods/dataTypes/objects/ObjectKeysTS"
+import { formatBytes } from "../../../background/methods/dataTypes/bytes"
+import { FFLoading } from "../../basicElements/Loading"
+import traffic_light from "../../../assets/images/icons/material.io/traffic_light.svg"
export default function Health() {
const [systemHealthData, setSystemHealthData] = useState<
SystemHealthData | null | "loading"
- >("loading");
- const errorMsg = "not reachable";
+ >("loading")
+ const errorMsg = "not reachable"
useEffect(() => {
- updateVariables();
- }, []);
+ updateVariables()
+ }, [])
useEffect(() => {
const timer = setTimeout(() => {
- updateVariables();
- }, 60000);
+ updateVariables()
+ }, 60000)
// Clear timeout if the component is unmounted
- return () => clearTimeout(timer);
- });
+ return () => clearTimeout(timer)
+ })
function updateVariables(): void {
Promise.all([callBackendHealth()])
.then(([data]) => {
- setSystemHealthData(data);
+ setSystemHealthData(data)
})
.catch(() => {
- setSystemHealthData(null);
- });
+ setSystemHealthData(null)
+ })
}
function getPathOfDataIntegrity(dataIntegrity: string): string {
if (hasKey(DataIntegrity, dataIntegrity)) {
- return DataIntegrity[dataIntegrity];
+ return DataIntegrity[dataIntegrity]
}
- console.log("[HEALTH] Couldn't parse SystemHealth string to enum.");
- return errorMsg;
+ console.log("[HEALTH] Couldn't parse SystemHealth string to enum.")
+ return errorMsg
}
function HealthContainer(): JSX.Element {
if (systemHealthData === null) {
- return {errorMsg}
;
+ return {errorMsg}
}
if (systemHealthData === "loading") {
- return ;
+ return
} else {
return (
@@ -124,7 +124,7 @@ export default function Health() {
- );
+ )
}
}
@@ -136,12 +136,12 @@ export default function Health() {
src={logo}
alt="Logo FileFighter"
onClick={() => {
- setAudioVolumeByID("audio_viking", 0.5);
- audioOnOff("audio_viking");
+ setAudioVolumeByID("audio_viking", 0.5)
+ audioOnOff("audio_viking")
}}
/>
- );
+ )
}
diff --git a/src/dev/testUtils/Wrapper.tsx b/src/dev/testUtils/Wrapper.tsx
index bde744c2..0e9d1135 100644
--- a/src/dev/testUtils/Wrapper.tsx
+++ b/src/dev/testUtils/Wrapper.tsx
@@ -1,15 +1,12 @@
-import React from "react";
-import {BrowserRouter} from "react-router-dom";
-import store from "../../background/redux/store";
-import {Provider} from "react-redux";
-
-export const Wrapper: React.FC = ({children}) => {
+import React from "react"
+import { BrowserRouter } from "react-router-dom"
+import store from "../../background/redux/store"
+import { Provider } from "react-redux"
+export const Wrapper: React.FC = ({ children }) => {
return (
-
- {children}
-
+ {children}
- );
-};
+ )
+}
diff --git a/src/index.tsx b/src/index.tsx
index 1993fd1b..1922545f 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,17 +1,17 @@
-import React from "react";
-import ReactDOM from "react-dom";
-import "./style/custom.scss";
-import * as serviceWorker from "./serviceWorker";
-import Constants from "./components/Constants";
+import React from "react"
+import ReactDOM from "react-dom"
+import "./style/custom.scss"
+import * as serviceWorker from "./serviceWorker"
+import Constants from "./components/Constants"
ReactDOM.render(
,
document.getElementById("root")
-);
+)
// If you want your app to work offline and load faster, you can change
// unregister() to register() below. Note this comes with some pitfalls.
// Learn more about service workers: https://bit.ly/CRA-PWA
-serviceWorker.unregister();
+serviceWorker.unregister()
diff --git a/src/serviceWorker.ts b/src/serviceWorker.ts
index d518244c..a9578a7c 100644
--- a/src/serviceWorker.ts
+++ b/src/serviceWorker.ts
@@ -18,34 +18,34 @@ const isLocalhost = Boolean(
window.location.hostname.match(
/^127(?:\.(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)){3}$/
)
-);
+)
type Config = {
- onSuccess?: (registration: ServiceWorkerRegistration) => void;
- onUpdate?: (registration: ServiceWorkerRegistration) => void;
-};
+ onSuccess?: (registration: ServiceWorkerRegistration) => void
+ onUpdate?: (registration: ServiceWorkerRegistration) => void
+}
export function register(config?: Config) {
if (process.env.NODE_ENV === "production" && "serviceWorker" in navigator) {
// The URL constructor is available in all browsers that support SW.
- const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href);
+ const publicUrl = new URL(process.env.PUBLIC_URL, window.location.href)
if (publicUrl.origin !== window.location.origin) {
// Our service worker won't work if PUBLIC_URL is on a different origin
// from what our page is served on. This might happen if a CDN is used to
// serve assets; see https://github.com/facebook/create-react-app/issues/2374
- return;
+ return
}
window.addEventListener("load", () => {
- const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`;
+ const swUrl = `${process.env.PUBLIC_URL}/service-worker.js`
if (!isLocalhost) {
// Is not localhost. Just register service worker
- registerValidSW(swUrl, config);
+ registerValidSW(swUrl, config)
}
// This is running on localhost. Let's check if a service worker still exists or not.
- checkValidServiceWorker(swUrl, config);
+ checkValidServiceWorker(swUrl, config)
// Add some additional logging to localhost, pointing developers to the
// service worker/PWA documentation.
@@ -53,9 +53,9 @@ export function register(config?: Config) {
console.log(
"This web app is being served cache-first by a service " +
"worker. To learn more, visit https://bit.ly/CRA-PWA"
- );
- });
- });
+ )
+ })
+ })
}
}
@@ -64,9 +64,9 @@ function registerValidSW(swUrl: string, config?: Config) {
.register(swUrl)
.then((registration) => {
registration.onupdatefound = () => {
- const installingWorker = registration.installing;
+ const installingWorker = registration.installing
if (installingWorker == null) {
- return;
+ return
}
installingWorker.onstatechange = () => {
if (installingWorker.state === "installed") {
@@ -74,13 +74,13 @@ function registerValidSW(swUrl: string, config?: Config) {
// At this point, everything has been precached.
// It's the perfect time to display a
// "Content is cached for offline use." message.
- console.log("Content is cached for offline use.");
+ console.log("Content is cached for offline use.")
// Execute callback
if (config && config.onSuccess) {
- config.onSuccess(registration);
+ config.onSuccess(registration)
}
- return;
+ return
}
// At this point, the updated precached content has been fetched,
// but the previous service worker will still serve the older
@@ -88,29 +88,29 @@ function registerValidSW(swUrl: string, config?: Config) {
console.log(
"New content is available and will be used when all " +
"tabs for this page are closed. See https://bit.ly/CRA-PWA."
- );
+ )
// Execute callback
if (config && config.onUpdate) {
- config.onUpdate(registration);
+ config.onUpdate(registration)
}
}
- };
- };
+ }
+ }
})
.catch((error) => {
- console.error("Error during service worker registration:", error);
- });
+ console.error("Error during service worker registration:", error)
+ })
}
function checkValidServiceWorker(swUrl: string, config?: Config) {
// Check if the service worker can be found. If it can't reload the page.
fetch(swUrl, {
- headers: { "Service-Worker": "script" }
+ headers: { "Service-Worker": "script" },
})
.then((response) => {
// Ensure service worker exists, and that we really are getting a JS file.
- const contentType = response.headers.get("content-type");
+ const contentType = response.headers.get("content-type")
if (
response.status === 404 ||
(contentType != null &&
@@ -119,29 +119,29 @@ function checkValidServiceWorker(swUrl: string, config?: Config) {
// No service worker found. Probably a different app. Reload the page.
navigator.serviceWorker.ready.then((registration) => {
registration.unregister().then(() => {
- window.location.reload();
- });
- });
+ window.location.reload()
+ })
+ })
} else {
// Service worker found. Proceed as normal.
- registerValidSW(swUrl, config);
+ registerValidSW(swUrl, config)
}
})
.catch(() => {
console.log(
"No internet connection found. App is running in offline mode."
- );
- });
+ )
+ })
}
export function unregister() {
if ("serviceWorker" in navigator) {
navigator.serviceWorker.ready
.then((registration) => {
- registration.unregister();
+ registration.unregister()
})
.catch((error) => {
- console.error(error.message);
- });
+ console.error(error.message)
+ })
}
}
diff --git a/src/setupTests.ts b/src/setupTests.ts
index 5fdf0016..3f9fc64c 100644
--- a/src/setupTests.ts
+++ b/src/setupTests.ts
@@ -2,4 +2,4 @@
// allows you to do things like:
// expect(element).toHaveTextContent(/react/i)
// learn more: https://github.com/testing-library/jest-dom
-import "@testing-library/jest-dom/extend-expect";
+import "@testing-library/jest-dom/extend-expect"
diff --git a/src/sonar-scanner.js b/src/sonar-scanner.js
index 4eafccd7..27677fbf 100644
--- a/src/sonar-scanner.js
+++ b/src/sonar-scanner.js
@@ -1,5 +1,5 @@
// sorry but this doesnt work in TypeScript pls dont kill me.
-const scanner = require("sonarqube-scanner");
+const scanner = require("sonarqube-scanner")
scanner(
{
@@ -9,8 +9,8 @@ scanner(
"sonar.projectName": "Frontend",
"sonar.projectDescription": "Frontend for FileFighter",
"sonar.login": process.env.SONAR_LOGIN,
- "sonar.password": process.env.SONAR_PASSWORD
- }
+ "sonar.password": process.env.SONAR_PASSWORD,
+ },
},
() => process.exit()
-);
+)