diff --git a/backend/tsconfig.json b/backend/tsconfig.json new file mode 100644 index 0000000..be55fae --- /dev/null +++ b/backend/tsconfig.json @@ -0,0 +1,85 @@ +{ + "compilerOptions": { + /* Basic Options */ + // "incremental": true, /* Enable incremental compilation */ + "target": "es6" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */, + "module": "CommonJS" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */, + // "lib": [], /* Specify library files to be included in the compilation. */ + "allowJs": true /* Allow javascript files to be compiled. */, + // "checkJs": true, /* Report errors in .js files. */ + // "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */ + // "declaration": true, /* Generates corresponding '.d.ts' file. */ + // "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */ + // "sourceMap": true, /* Generates corresponding '.map' file. */ + // "outFile": "./", /* Concatenate and emit output to single file. */ + "outDir": "../dist" /* Redirect output structure to the directory. */, + "rootDir": "./" /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */, + // "composite": true, /* Enable project compilation */ + // "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */ + // "removeComments": true, /* Do not emit comments to output. */ + // "noEmit": true, /* Do not emit outputs. */ + // "importHelpers": true, /* Import emit helpers from 'tslib'. */ + // "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */ + // "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */ + /* Strict Type-Checking Options */ + "strict": true /* Enable all strict type-checking options. */, + // "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */ + // "strictNullChecks": true, /* Enable strict null checks. */ + // "strictFunctionTypes": true, /* Enable strict checking of function types. */ + // "strictBindCallApply": true, /* Enable strict 'bind', 'call', and 'apply' methods on functions. */ + // "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */ + // "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */ + // "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */ + + /* Additional Checks */ + // "noUnusedLocals": true, /* Report errors on unused locals. */ + // "noUnusedParameters": true, /* Report errors on unused parameters. */ + // "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */ + // "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */ + + /* Module Resolution Options */ + "moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */, + // "baseUrl": "./", /* Base directory to resolve non-absolute module names. */ + // "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */ + // "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */ + "typeRoots": [ + "./node_modules/@types" + ] /* List of folders to include type definitions from. */, + "types": [ + "node" + ] /* Type declaration files to be included in compilation. */, + // "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */ + "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */, + // "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */ + // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ + /* Source Map Options */ + // "sourceRoot": "", /* Specify the location where debugger should locate TypeScript files instead of source locations. */ + // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ + // "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */ + // "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */ + + /* Experimental Options */ + // "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */ + // "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */ + + /* Advanced Options */ + "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */ + }, + "exclude": [ + "serverUtils", + "src", + "tests", + "key", + "public", + "node_modules", + "webpack.config.js", + "dist", + "webUI", + "webUI.config.js", + "webUISetup", + "webUISetup.config.js", + "vite.config.js", + "tailwind.config.js", + "postcss.config.js" + ] +} diff --git a/index.html b/index.html index 363a288..3018129 100644 --- a/index.html +++ b/index.html @@ -19,6 +19,6 @@
- + diff --git a/package.json b/package.json index d686d56..4604e21 100755 --- a/package.json +++ b/package.json @@ -33,8 +33,7 @@ "remove-tokens:dev": "NODE_ENV=development node serverUtils/removeTokens.js", "vite-test": "vite", "dev-test": "concurrently \"vite\" \"nodemon server.js\"", - "watch:backend": "tsc -w", - "dev-hot": "concurrently \"vite\" \"tsc -w\" \"npm run dev:backend\"", + "dev-hot": "concurrently \"vite\" \"tsc -w -p ./backend/tsconfig.json\" \"npm run dev:backend\"", "dev:backend": "nodemon dist/server/serverStart.js" }, "dependencies": { @@ -57,6 +56,8 @@ "@types/helmet": "0.0.45", "@types/jsonwebtoken": "^8.3.9", "@types/node": "^20.14.2", + "@types/react": "^18.3.3", + "@types/react-dom": "^18.3.0", "@types/request": "^2.48.5", "@types/request-ip": "0.0.35", "@types/sharp": "^0.25.0", diff --git a/src/app.js b/src/app.tsx similarity index 91% rename from src/app.js rename to src/app.tsx index 9036fbd..4fbe4c0 100755 --- a/src/app.js +++ b/src/app.tsx @@ -1,4 +1,3 @@ -import React from "react"; import ReactDOM from "react-dom/client"; import { Provider } from "react-redux"; import configStore from "./store/configureStore"; @@ -8,7 +7,6 @@ import "./styles/styles.scss"; import "core-js/stable"; import "regenerator-runtime/runtime"; import "react-circular-progressbar/dist/styles.css"; -import { AuthProvider } from "./providers/AuthProvider"; import { QueryClient, QueryClientProvider } from "react-query"; // import '../node_modules/@fortawesome/fontawesome-free/css/all.css'; // import '../node_modules/@fortawesome/fontawesome-free/js/all.js'; diff --git a/src/components/AddStorageItem/AddStorageItem.js b/src/components/AddStorageItem/AddStorageItem.jsx similarity index 100% rename from src/components/AddStorageItem/AddStorageItem.js rename to src/components/AddStorageItem/AddStorageItem.jsx diff --git a/src/components/AddStorageItem/index.js b/src/components/AddStorageItem/index.jsx similarity index 100% rename from src/components/AddStorageItem/index.js rename to src/components/AddStorageItem/index.jsx diff --git a/src/components/AddStoragePage/AddStoragePage.js b/src/components/AddStoragePage/AddStoragePage.jsx similarity index 100% rename from src/components/AddStoragePage/AddStoragePage.js rename to src/components/AddStoragePage/AddStoragePage.jsx diff --git a/src/components/AddStoragePage/index.js b/src/components/AddStoragePage/index.jsx similarity index 100% rename from src/components/AddStoragePage/index.js rename to src/components/AddStoragePage/index.jsx diff --git a/src/components/Dataform/DataForm.js b/src/components/Dataform/DataForm.jsx similarity index 99% rename from src/components/Dataform/DataForm.js rename to src/components/Dataform/DataForm.jsx index 5d85fdc..4b284a0 100644 --- a/src/components/Dataform/DataForm.js +++ b/src/components/Dataform/DataForm.jsx @@ -1,5 +1,5 @@ -import FileItem from ".././FileItem"; -import FolderItem from ".././FolderItem"; +import FileItem from "../FileItem"; +import FolderItem from "../FolderItem"; import React from "react"; import QuickAccess from "../QuickAccess"; import ParentBar from "../ParentBar"; diff --git a/src/components/Dataform/index.js b/src/components/Dataform/index.jsx similarity index 100% rename from src/components/Dataform/index.js rename to src/components/Dataform/index.jsx diff --git a/src/components/DownloadPage/DownloadPage.js b/src/components/DownloadPage/DownloadPage.js deleted file mode 100644 index 36b0180..0000000 --- a/src/components/DownloadPage/DownloadPage.js +++ /dev/null @@ -1,35 +0,0 @@ -import Spinner from ".././SpinnerLogin"; -import React from "react"; - -const DownloadPage = ({download,state}) => { - - if (state.size === "" && !state.error) { - - return
- -
- } - - return ( - -
- - {!state.error ? - - (
-

{state.title}

-

Type: {state.type}

-

Size: {state.size}

- -
) - : -
-

Unauthorized/Not Found Download

-
- } - -
) -} - -export default DownloadPage; - diff --git a/src/components/DownloadPage/DownloadPage.jsx b/src/components/DownloadPage/DownloadPage.jsx new file mode 100644 index 0000000..f0a155a --- /dev/null +++ b/src/components/DownloadPage/DownloadPage.jsx @@ -0,0 +1,33 @@ +import Spinner from "../SpinnerLogin"; +import React from "react"; + +const DownloadPage = ({ download, state }) => { + if (state.size === "" && !state.error) { + return ( +
+ +
+ ); + } + + return ( +
+ {!state.error ? ( +
+

{state.title}

+

Type: {state.type}

+

Size: {state.size}

+ +
+ ) : ( +
+

Unauthorized/Not Found Download

+
+ )} +
+ ); +}; + +export default DownloadPage; diff --git a/src/components/DownloadPage/index.js b/src/components/DownloadPage/index.jsx similarity index 100% rename from src/components/DownloadPage/index.js rename to src/components/DownloadPage/index.jsx diff --git a/src/components/FileItem/FileItem.js b/src/components/FileItem/FileItem.jsx similarity index 100% rename from src/components/FileItem/FileItem.js rename to src/components/FileItem/FileItem.jsx diff --git a/src/components/FileItem/index.js b/src/components/FileItem/index.jsx similarity index 100% rename from src/components/FileItem/index.js rename to src/components/FileItem/index.jsx diff --git a/src/components/FolderItem/FolderItem.js b/src/components/FolderItem/FolderItem.jsx similarity index 100% rename from src/components/FolderItem/FolderItem.js rename to src/components/FolderItem/FolderItem.jsx diff --git a/src/components/FolderItem/index.js b/src/components/FolderItem/index.jsx similarity index 100% rename from src/components/FolderItem/index.js rename to src/components/FolderItem/index.jsx diff --git a/src/components/FolderTree/FolderTree.js b/src/components/FolderTree/FolderTree.js deleted file mode 100644 index a8dc2e1..0000000 --- a/src/components/FolderTree/FolderTree.js +++ /dev/null @@ -1,23 +0,0 @@ -import React from "react"; -import env from "../../enviroment/envFrontEnd"; -import FolderTreeStorage from ".././FolderTreeStorage" - -const FolderTree = (props) => ( - -
-
- - {(env.activeSubscription || !env.commercialMode) ? : undefined} - {env.s3Enabled ? : undefined} - {env.googleDriveEnabled ? : undefined} -
-
- - //
- // {(env.activeSubscription || !env.commercialMode) ? : undefined} - // {env.s3Enabled ? : undefined} - // {env.googleDriveEnabled ? : undefined} - //
-) - -export default FolderTree; \ No newline at end of file diff --git a/src/components/FolderTree/FolderTree.jsx b/src/components/FolderTree/FolderTree.jsx new file mode 100644 index 0000000..91f8794 --- /dev/null +++ b/src/components/FolderTree/FolderTree.jsx @@ -0,0 +1,31 @@ +import React from "react"; +import env from "../../enviroment/envFrontEnd"; +import FolderTreeStorage from "../FolderTreeStorage"; + +const FolderTree = (props) => ( +
+
+ {env.activeSubscription || !env.commercialMode ? ( + + ) : undefined} + {env.s3Enabled ? : undefined} + {env.googleDriveEnabled ? ( + + ) : undefined} +
+
+ + //
+ // {(env.activeSubscription || !env.commercialMode) ? : undefined} + // {env.s3Enabled ? : undefined} + // {env.googleDriveEnabled ? : undefined} + //
+); + +export default FolderTree; diff --git a/src/components/FolderTree/index.js b/src/components/FolderTree/index.jsx similarity index 100% rename from src/components/FolderTree/index.js rename to src/components/FolderTree/index.jsx diff --git a/src/components/FolderTreeStorage/FolderTreeStorage.js b/src/components/FolderTreeStorage/FolderTreeStorage.js deleted file mode 100644 index bbf8767..0000000 --- a/src/components/FolderTreeStorage/FolderTreeStorage.js +++ /dev/null @@ -1,39 +0,0 @@ -import React from "react"; -import FolderTreeStorageSub from ".././FolderTreeStorageSub"; - -const FolderTreeStorage = (props) => ( - -
-
-
- -
-
-

{props.type === "drive" ? "Google Drive" : props.type === "mongo" ? "myDrive" : "Amazon S3"}

-
-
- -
-
- {(props.state.open && props.state.folders.length !== 0) ? props.state.folders.map((folder) => { - return - }) : undefined} -
-
-
- //return - - //
- //
- // arrowstructure - //
- //

{props.type === "drive" ? "Google Drive" : props.type === "mongo" ? "myDrive" : "Amazon S3"}

- //
- //
- // {(props.state.open && props.state.folders.length !== 0) ? props.state.folders.map((folder) => { - // return - // }) : undefined} - //
-) - -export default FolderTreeStorage; \ No newline at end of file diff --git a/src/components/FolderTreeStorage/FolderTreeStorage.jsx b/src/components/FolderTreeStorage/FolderTreeStorage.jsx new file mode 100644 index 0000000..834e773 --- /dev/null +++ b/src/components/FolderTreeStorage/FolderTreeStorage.jsx @@ -0,0 +1,54 @@ +import React from "react"; +import FolderTreeStorageSub from "../FolderTreeStorageSub"; + +const FolderTreeStorage = (props) => ( +
+
+
+ +
+
+

+ {props.type === "drive" + ? "Google Drive" + : props.type === "mongo" + ? "myDrive" + : "Amazon S3"} +

+
+
+ +
+
+ {props.state.open && props.state.folders.length !== 0 + ? props.state.folders.map((folder) => { + return ; + }) + : undefined} +
+
+
+ //return + + //
+ //
+ // arrowstructure + //
+ //

{props.type === "drive" ? "Google Drive" : props.type === "mongo" ? "myDrive" : "Amazon S3"}

+ //
+ //
+ // {(props.state.open && props.state.folders.length !== 0) ? props.state.folders.map((folder) => { + // return + // }) : undefined} + //
+); + +export default FolderTreeStorage; diff --git a/src/components/FolderTreeStorage/index.js b/src/components/FolderTreeStorage/index.jsx similarity index 100% rename from src/components/FolderTreeStorage/index.js rename to src/components/FolderTreeStorage/index.jsx diff --git a/src/components/FolderTreeStorageSub/FolderTreeStorageSub.js b/src/components/FolderTreeStorageSub/FolderTreeStorageSub.jsx similarity index 100% rename from src/components/FolderTreeStorageSub/FolderTreeStorageSub.js rename to src/components/FolderTreeStorageSub/FolderTreeStorageSub.jsx diff --git a/src/components/FolderTreeStorageSub/index.js b/src/components/FolderTreeStorageSub/index.jsx similarity index 99% rename from src/components/FolderTreeStorageSub/index.js rename to src/components/FolderTreeStorageSub/index.jsx index 93a17b4..85bdc3c 100644 --- a/src/components/FolderTreeStorageSub/index.js +++ b/src/components/FolderTreeStorageSub/index.jsx @@ -13,7 +13,7 @@ import { } from "../../actions/folderTree"; // import { history } from "../../routers/AppRouter"; import { connect } from "react-redux"; -import FolderTreeStorageSub2 from ".././FolderTreeStorageSub"; +import FolderTreeStorageSub2 from "."; import FolderTreeStorageSub from "./FolderTreeStorageSub"; class FolderTreeStorageSubContainer extends React.Component { diff --git a/src/components/GoogleAccountPage/GoogleAccountPage.js b/src/components/GoogleAccountPage/GoogleAccountPage.jsx similarity index 100% rename from src/components/GoogleAccountPage/GoogleAccountPage.js rename to src/components/GoogleAccountPage/GoogleAccountPage.jsx diff --git a/src/components/GoogleAccountPage/index.js b/src/components/GoogleAccountPage/index.jsx similarity index 100% rename from src/components/GoogleAccountPage/index.js rename to src/components/GoogleAccountPage/index.jsx diff --git a/src/components/Header/Header.js b/src/components/Header/Header.jsx similarity index 100% rename from src/components/Header/Header.js rename to src/components/Header/Header.jsx diff --git a/src/components/Header/index.js b/src/components/Header/index.jsx similarity index 100% rename from src/components/Header/index.js rename to src/components/Header/index.jsx diff --git a/src/components/HocComponent/index.js b/src/components/HocComponent/index.jsx similarity index 100% rename from src/components/HocComponent/index.js rename to src/components/HocComponent/index.jsx diff --git a/src/components/Homepage/HomePage.js b/src/components/Homepage/HomePage.jsx similarity index 84% rename from src/components/Homepage/HomePage.js rename to src/components/Homepage/HomePage.jsx index bb4c2eb..9f5d92c 100644 --- a/src/components/Homepage/HomePage.js +++ b/src/components/Homepage/HomePage.jsx @@ -1,7 +1,7 @@ -import Header from ".././Header"; -import LeftSection from ".././LeftSection"; -import MainSection from ".././MainSection"; -import Uploader from ".././Uploader"; +import Header from "../Header"; +import LeftSection from "../LeftSection"; +import MainSection from "../MainSection"; +import Uploader from "../Uploader"; import React from "react"; import PhotoViewer from "../PhotoViewer"; import ShareModel from "../ShareModel"; diff --git a/src/components/Homepage/Homepage2.js b/src/components/Homepage/Homepage2.jsx similarity index 100% rename from src/components/Homepage/Homepage2.js rename to src/components/Homepage/Homepage2.jsx diff --git a/src/components/Homepage/Homepage2.tsxk b/src/components/Homepage/Homepage2.txt similarity index 100% rename from src/components/Homepage/Homepage2.tsxk rename to src/components/Homepage/Homepage2.txt diff --git a/src/components/Homepage/index.js b/src/components/Homepage/index.jsx similarity index 100% rename from src/components/Homepage/index.js rename to src/components/Homepage/index.jsx diff --git a/src/components/HomepageSpinner/index.js b/src/components/HomepageSpinner/index.jsx similarity index 100% rename from src/components/HomepageSpinner/index.js rename to src/components/HomepageSpinner/index.jsx diff --git a/src/components/InvoiceItem/InvoiceItem.js b/src/components/InvoiceItem/InvoiceItem.jsx similarity index 100% rename from src/components/InvoiceItem/InvoiceItem.js rename to src/components/InvoiceItem/InvoiceItem.jsx diff --git a/src/components/InvoiceItem/index.js b/src/components/InvoiceItem/index.jsx similarity index 100% rename from src/components/InvoiceItem/index.js rename to src/components/InvoiceItem/index.jsx diff --git a/src/components/LeftSection/LeftSection.js b/src/components/LeftSection/LeftSection.js deleted file mode 100644 index 026eb1a..0000000 --- a/src/components/LeftSection/LeftSection.js +++ /dev/null @@ -1,77 +0,0 @@ -import FolderTree from ".././FolderTree"; -import React from "react"; -import UploadStorageSwitcher from "../UploadStorageSwitcher"; -import mobilecheck from "../../utils/mobileCheck"; - -class LeftSection extends React.Component { - - constructor(props) { - super(props); - - this.isMobile = mobilecheck(); - this.nonDropMode = window.localStorage.getItem('non_drop-mode'); - } - - render() { - - return ( - -
- - -
- ) - } -} - -export default LeftSection; diff --git a/src/components/LeftSection/LeftSection.jsx b/src/components/LeftSection/LeftSection.jsx new file mode 100644 index 0000000..cd6de81 --- /dev/null +++ b/src/components/LeftSection/LeftSection.jsx @@ -0,0 +1,122 @@ +import FolderTree from "../FolderTree"; +import React from "react"; +import UploadStorageSwitcher from "../UploadStorageSwitcher"; +import mobilecheck from "../../utils/mobileCheck"; + +class LeftSection extends React.Component { + constructor(props) { + super(props); + + this.isMobile = mobilecheck(); + this.nonDropMode = window.localStorage.getItem("non_drop-mode"); + } + + render() { + return ( +
+ +
+ ); + } +} + +export default LeftSection; diff --git a/src/components/LeftSection/index.js b/src/components/LeftSection/index.jsx similarity index 100% rename from src/components/LeftSection/index.js rename to src/components/LeftSection/index.jsx diff --git a/src/components/LoginPage/LoginPage.js b/src/components/LoginPage/LoginPage.jsx similarity index 99% rename from src/components/LoginPage/LoginPage.js rename to src/components/LoginPage/LoginPage.jsx index a727fc5..c2560ee 100755 --- a/src/components/LoginPage/LoginPage.js +++ b/src/components/LoginPage/LoginPage.jsx @@ -1,4 +1,4 @@ -import SpinnerLogin from ".././SpinnerLogin"; +import SpinnerLogin from "../SpinnerLogin"; import React from "react"; import env from "../../enviroment/envFrontEnd"; diff --git a/src/components/LoginPage/index.js b/src/components/LoginPage/index.jsx similarity index 100% rename from src/components/LoginPage/index.js rename to src/components/LoginPage/index.jsx diff --git a/src/components/MainSection/MainSection.js b/src/components/MainSection/MainSection.js deleted file mode 100644 index 5582598..0000000 --- a/src/components/MainSection/MainSection.js +++ /dev/null @@ -1,66 +0,0 @@ -import DataForm from ".././Dataform"; -import RightSection from ".././RightSection"; -import MoverMenu from ".././MoverMenu"; -import PopupWindow from '.././PopupWindow' -import React from "react"; - - -const MainSection = React.forwardRef((props, ref) => { - - return ( - -
-
- -
-
- - -
-
- - {true ? undefined :
-
-
- get -
-
All your files in one place
-

Drag and drop a file to get started

-
-
} - - {props.routeType === "search" ? -
-
-

{props.files.length + props.folders.length >= 50 ? "50+" : props.files.length + props.folders.length} results for {props.cachedSearch}

-

You are searching in {props.parent === "/" ? "Home" : props.parentNameList.length !== 0 ? props.parentNameList[props.parentNameList.length - 1] : "Unknown"} spacer Show results from everywhere

-
-
: undefined} - - {props.showPopup ? : undefined} - - {props.moverID.length === 0 ? undefined : - - } - - - - - - -
-
- -) - -}) - - -export default MainSection \ No newline at end of file diff --git a/src/components/MainSection/MainSection.jsx b/src/components/MainSection/MainSection.jsx new file mode 100644 index 0000000..ca9e9d2 --- /dev/null +++ b/src/components/MainSection/MainSection.jsx @@ -0,0 +1,116 @@ +import DataForm from "../Dataform"; +import RightSection from "../RightSection"; +import MoverMenu from "../MoverMenu"; +import PopupWindow from "../PopupWindow"; +import React from "react"; + +const MainSection = React.forwardRef((props, ref) => { + return ( +
+
+
+ + + + + + +
+
+ {true ? undefined : ( +
+
+
+ get +
+
All your files in one place
+

Drag and drop a file to get started

+
+
+ )} + + {props.routeType === "search" ? ( +
+
+

+ + {props.files.length + props.folders.length >= 50 + ? "50+" + : props.files.length + props.folders.length} + {" "} + results for{" "} + {props.cachedSearch} +

+

+ You are searching in{" "} + + {props.parent === "/" + ? "Home" + : props.parentNameList.length !== 0 + ? props.parentNameList[props.parentNameList.length - 1] + : "Unknown"} + {" "} + + spacer + + {" "} + + Show results from everywhere + +

+
+
+ ) : undefined} + + {props.showPopup ? ( + + ) : undefined} + + {props.moverID.length === 0 ? undefined : } + + + + +
+
+ ); +}); + +export default MainSection; diff --git a/src/components/MainSection/index.js b/src/components/MainSection/index.jsx similarity index 100% rename from src/components/MainSection/index.js rename to src/components/MainSection/index.jsx diff --git a/src/components/MobileContextMenu/index.js b/src/components/MobileContextMenu/index.jsx similarity index 100% rename from src/components/MobileContextMenu/index.js rename to src/components/MobileContextMenu/index.jsx diff --git a/src/components/MoverMenu/MoverMenu.js b/src/components/MoverMenu/MoverMenu.jsx similarity index 100% rename from src/components/MoverMenu/MoverMenu.js rename to src/components/MoverMenu/MoverMenu.jsx diff --git a/src/components/MoverMenu/index.js b/src/components/MoverMenu/index.jsx similarity index 100% rename from src/components/MoverMenu/index.js rename to src/components/MoverMenu/index.jsx diff --git a/src/components/MoverModel/index.js b/src/components/MoverModel/index.jsx similarity index 100% rename from src/components/MoverModel/index.js rename to src/components/MoverModel/index.jsx diff --git a/src/components/NewContextMenu/NewContextMenu.js b/src/components/NewContextMenu/NewContextMenu.jsx similarity index 100% rename from src/components/NewContextMenu/NewContextMenu.js rename to src/components/NewContextMenu/NewContextMenu.jsx diff --git a/src/components/NewContextMenu/index.js b/src/components/NewContextMenu/index.jsx similarity index 100% rename from src/components/NewContextMenu/index.js rename to src/components/NewContextMenu/index.jsx diff --git a/src/components/ParentBar/ParentBar.js b/src/components/ParentBar/ParentBar.jsx similarity index 100% rename from src/components/ParentBar/ParentBar.js rename to src/components/ParentBar/ParentBar.jsx diff --git a/src/components/ParentBar/index.js b/src/components/ParentBar/index.jsx similarity index 100% rename from src/components/ParentBar/index.js rename to src/components/ParentBar/index.jsx diff --git a/src/components/ParentBarChild/index.js b/src/components/ParentBarChild/index.jsx similarity index 100% rename from src/components/ParentBarChild/index.js rename to src/components/ParentBarChild/index.jsx diff --git a/src/components/PhotoViewer/PhotoViewer.js b/src/components/PhotoViewer/PhotoViewer.jsx similarity index 100% rename from src/components/PhotoViewer/PhotoViewer.js rename to src/components/PhotoViewer/PhotoViewer.jsx diff --git a/src/components/PhotoViewer/index.js b/src/components/PhotoViewer/index.jsx similarity index 100% rename from src/components/PhotoViewer/index.js rename to src/components/PhotoViewer/index.jsx diff --git a/src/components/PopupWindow/PopupWindow.js b/src/components/PopupWindow/PopupWindow.js deleted file mode 100644 index 8cde7dd..0000000 --- a/src/components/PopupWindow/PopupWindow.js +++ /dev/null @@ -1,97 +0,0 @@ -import Spinner from ".././Spinner"; -import capitalize from "../../utils/capitalize"; -import React from "react"; -import moment from "moment"; -import bytes from "bytes"; - -class PopupWindow extends React.Component { - - constructor(props) { - super(props); - - } - - render() { - - return ( -
- -

{capitalize(this.props.popupFile.filename)}

- -
- - {!this.props.popupFile.metadata.isVideo ? -
- - {!this.props.popupFile.metadata.hasThumbnail ?

No Preview Available

: undefined} - - {!this.props.popupFile.metadata.hasThumbnail ? - : } - -
- {!this.props.popupFile.metadata.hasThumbnail ? undefined : } -
-
- : - } -
-
-

Location: {this.props.popupFile.metadata.drive ? "Google Drive" : this.props.popupFile.metadata.personalFile ? "Amazon S3" : "myDrive"}

-

File Size: {bytes(+this.props.popupFile.metadata.size)}

-

Created: {moment(this.props.popupFile.uploadDate).format("L")}

-
- -
-
-
-
- - -
- ) - - return ( -
- -

{capitalize(this.props.popupFile.filename)}

- - {!this.props.popupFile.metadata.isVideo ? - -
- - {!this.props.popupFile.metadata.hasThumbnail ?

No Preview Available

: undefined} - - {!this.props.popupFile.metadata.hasThumbnail ? - : } - -
- {!this.props.popupFile.metadata.hasThumbnail ? undefined : } -
-
- : - - } - - - -
- ) - } - -} - - -export default PopupWindow - diff --git a/src/components/PopupWindow/PopupWindow.jsx b/src/components/PopupWindow/PopupWindow.jsx new file mode 100644 index 0000000..3887af0 --- /dev/null +++ b/src/components/PopupWindow/PopupWindow.jsx @@ -0,0 +1,180 @@ +import Spinner from "../Spinner"; +import capitalize from "../../utils/capitalize"; +import React from "react"; +import moment from "moment"; +import bytes from "bytes"; + +class PopupWindow extends React.Component { + constructor(props) { + super(props); + } + + render() { + return ( +
+

+ {capitalize(this.props.popupFile.filename)} +

+ +
+ {!this.props.popupFile.metadata.isVideo ? ( +
+ {!this.props.popupFile.metadata.hasThumbnail ? ( +

No Preview Available

+ ) : undefined} + + {!this.props.popupFile.metadata.hasThumbnail ? ( + + ) : ( + + )} + +
+ {!this.props.popupFile.metadata.hasThumbnail ? undefined : ( + + )} +
+
+ ) : ( + + )} +
+
+

+ Location:{" "} + {this.props.popupFile.metadata.drive + ? "Google Drive" + : this.props.popupFile.metadata.personalFile + ? "Amazon S3" + : "myDrive"} +

+

+ File Size: {bytes(+this.props.popupFile.metadata.size)} +

+

+ Created: {moment(this.props.popupFile.uploadDate).format("L")} +

+
+ +
+
+
+
+ + +
+ ); + + return ( +
+

+ {capitalize(this.props.popupFile.filename)} +

+ + {!this.props.popupFile.metadata.isVideo ? ( +
+ {!this.props.popupFile.metadata.hasThumbnail ? ( +

No Preview Available

+ ) : undefined} + + {!this.props.popupFile.metadata.hasThumbnail ? ( + + ) : ( + + )} + +
+ {!this.props.popupFile.metadata.hasThumbnail ? undefined : ( + + )} +
+
+ ) : ( + + )} + + + +
+ ); + } +} + +export default PopupWindow; diff --git a/src/components/PopupWindow/index.js b/src/components/PopupWindow/index.jsx similarity index 100% rename from src/components/PopupWindow/index.js rename to src/components/PopupWindow/index.jsx diff --git a/src/components/QuickAccess/QuickAccess.js b/src/components/QuickAccess/QuickAccess.jsx similarity index 92% rename from src/components/QuickAccess/QuickAccess.js rename to src/components/QuickAccess/QuickAccess.jsx index 68afb56..27829e2 100644 --- a/src/components/QuickAccess/QuickAccess.js +++ b/src/components/QuickAccess/QuickAccess.jsx @@ -1,4 +1,4 @@ -import QuickAccessItem from ".././QuickAccessItem"; +import QuickAccessItem from "../QuickAccessItem"; import React from "react"; const QuickAccess = (props) => ( diff --git a/src/components/QuickAccess/index.js b/src/components/QuickAccess/index.jsx similarity index 100% rename from src/components/QuickAccess/index.js rename to src/components/QuickAccess/index.jsx diff --git a/src/components/QuickAccessItem/QuickAccessItem.js b/src/components/QuickAccessItem/QuickAccessItem.jsx similarity index 100% rename from src/components/QuickAccessItem/QuickAccessItem.js rename to src/components/QuickAccessItem/QuickAccessItem.jsx diff --git a/src/components/QuickAccessItem/index.js b/src/components/QuickAccessItem/index.jsx similarity index 100% rename from src/components/QuickAccessItem/index.js rename to src/components/QuickAccessItem/index.jsx diff --git a/src/components/ResetPasswordPage/ResetPasswordPage.js b/src/components/ResetPasswordPage/ResetPasswordPage.jsx similarity index 100% rename from src/components/ResetPasswordPage/ResetPasswordPage.js rename to src/components/ResetPasswordPage/ResetPasswordPage.jsx diff --git a/src/components/ResetPasswordPage/index.js b/src/components/ResetPasswordPage/index.jsx similarity index 100% rename from src/components/ResetPasswordPage/index.js rename to src/components/ResetPasswordPage/index.jsx diff --git a/src/components/RightSection/RightSection.js b/src/components/RightSection/RightSection.jsx similarity index 100% rename from src/components/RightSection/RightSection.js rename to src/components/RightSection/RightSection.jsx diff --git a/src/components/RightSection/index.js b/src/components/RightSection/index.js deleted file mode 100644 index d61d834..0000000 --- a/src/components/RightSection/index.js +++ /dev/null @@ -1,332 +0,0 @@ -import RightSection from "./RightSection"; -import RightSectionDetail from ".././RightSectionDetail" -import {editFileMetadata, startRemoveFile, startRenameFile} from "../../actions/files" -import {resetSelectedItem} from "../../actions/selectedItem"; -import env from "../../enviroment/envFrontEnd"; -import axios from "../../axiosInterceptor"; -import {connect} from "react-redux"; -import React from "react"; -import { setRightSectionMode } from "../../actions/main"; -import Swal from "sweetalert2"; -import { startRemoveFolder, startRenameFolder } from "../../actions/folders"; -import { setMoverID } from "../../actions/mover"; -import mobilecheck from "../../utils/mobileCheck"; -import { setMobileContextMenu } from "../../actions/mobileContextMenu"; - -class RightSectionContainer extends React.Component { - - constructor(props) { - super(props); - - this.state = { - optimizing: false, - optimizing_finished: false, - optimizing_removed: false, - contextSelected: false - } - - this.prevID = "" - - this.rightSectionRef = React.createRef() - } - - getFileExtension = (filename) => { - - const filenameSplit = filename.split("."); - - if (filenameSplit.length > 1) { - - const extension = filenameSplit[filenameSplit.length - 1] - - return extension.toUpperCase(); - - } else { - - return "Unknown" - } - - - } - - getSidebarClassName = (value) => { - - if (value==="gone") { - return "section section--right section--no-animation" - } else if (value) { - return "section section--right" - } else { - return "section section--right section--minimized" - } - } - - removeTranscodeVideo = (props, e) => { - - const data = {id: props.selectedItem.id} - - axios.delete('/file-service/transcode-video/remove', { - data - }).then(() => { - - this.props.dispatch(editFileMetadata(props.selectedItem.id, {transcoded: undefined})) - - this.setState(() => ({ - ...this.state, - optimizing: false, - optimizing_finished: false, - optimizing_removed: true - })) - - }).catch((err) => { - console.log(err) - }) - } - - transcodeVideo = (props, e) => { - - const config = { - file: {_id: props.selectedItem.id} - }; - - const data = {file: {_id: props.selectedItem.id}} - - this.setState(() => ({ - ...this.state, - optimizing: true - })) - - - axios.post('/file-service/transcode-video', data,config) - .then((response) => { - - const data = response.data; - - if (data === "Finished") { - - this.props.dispatch(editFileMetadata(props.selectedItem.id, {isVideo: true, transcoded: true})) - - this.setState(() => ({ - ...this.state, - optimizing: false, - optimizing_finished: true, - optimizing_removed: false - })) - } - - }).catch((err) => { - console.log(err) - }) - } - - getTranscodeButton = (props) => { - - if (!props.selectedItem.isVideo || !env.enableVideoTranscoding) { - return undefined; - } - - if (this.state.optimizing && !this.state.optimizing_finished) { - return (
- -
) - - } else if ((props.selectedItem.transcoded || this.state.optimizing_finished) && !this.state.optimizing_removed) { - return (
- -
) - } else { - return (
- -
) - } - } - - getPublicStatus = () => { - - if (this.props.selectedItem.linkType === "one") { - - return - - } else { - - return - } - } - - resetState = () => { - - if (this.prevID !== "" && this.prevID !== this.props.selectedItem.id) { - - this.setState(() => ({ - ...this.state, - optimizing: false, - optimizing_finished: false - })) - } - } - - resetSelected = () => { - - this.props.dispatch(resetSelectedItem()); - } - - handleClickOutside = (e) => { - - if (this.rightSectionRef && !this.rightSectionRef.current.contains(event.target)) { - if (this.props.rightSectionMode === 'open') { - this.props.dispatch(setRightSectionMode('close')) - this.closeContext(); - } - } - } - - componentDidMount = () => { - document.addEventListener('mousedown', this.handleClickOutside); - } - - componentWillUnmount = () => { - document.removeEventListener('mousedown', this.handleClickOutside); - } - - openItem = (e) => { - - if (this.props.selectedItem.file) { - this.props.fileClick(this.props.selectedItem.id, this.props.selectedItem.data, false, true) - } else { - this.props.folderClick(this.props.selectedItem.id, this.props.selectedItem.data, true) - } - } - - closeContext = () => { - - this.setState(() => { - return { - ...this.state, - contextSelected: false - } - }) - } - - selectContext = (e) => { - - if (e) e.stopPropagation() - if (e) e.preventDefault(); - - // if (mobilecheck()) { - - // this.props.dispatch(setMobileContextMenu(this.props.selectedItem.file, this.props.selectedItem.data)); - // return; - // } - - console.log("right props", this.props.selectedItem) - - this.setState(() => { - return { - ...this.state, - contextSelected: !this.state.contextSelected - } - }) - } - - clickStopPropagation = (e) => { - if (e) e.stopPropagation() - } - - clickTest = (e) => { - console.log("click test") - } - - changeEditNameMode = async() => { - - let inputValue = this.props.selectedItem.name; - - const { value: folderName} = await Swal.fire({ - title: 'Enter A File Name', - input: 'text', - inputValue: inputValue, - showCancelButton: true, - inputValidator: (value) => { - if (!value) { - return 'Please Enter a Name' - } - } - }) - - if (folderName === undefined || folderName === null) { - - return; - } - - //this.props.selectedItem.drive - - const parent = this.props.selectedItem.file ? this.props.selectedItem.data.metadata.parent : this.props.selectedItem.data.parent; - - this.props.selectedItem.file ? - this.props.dispatch(startRenameFile(this.props.selectedItem.id, folderName, this.props.selectedItem.drive)) : - this.props.dispatch(startRenameFolder(this.props.selectedItem.id, folderName, this.props.selectedItem.drive, parent)); - - //this.props.dispatch(startRenameFolder(this.props.selectedItem.data._id, folderName, this.props.selectedItem.data.)); - } - - startMoveFolder = async() => { - - const parent = this.props.selectedItem.file ? this.props.selectedItem.data.metadata.parent : this.props.selectedItem.data.parent; - const isPersonal = this.props.selectedItem.file ? this.props.selectedItem.data.metadata.personalFile : this.props.selectedItem.data.personalFolder; - - this.props.dispatch(setMoverID(this.props.selectedItem.id, parent, this.props.selectedItem.file, this.props.selectedItem.drive, isPersonal)); - } - - changeDeleteMode = async() => { - - const parent = this.props.selectedItem.file ? this.props.selectedItem.data.metadata.parent : this.props.selectedItem.data.parent; - - - Swal.fire({ - title: 'Confirm Deletion', - text: "You cannot undo this action", - icon: 'warning', - showCancelButton: true, - confirmButtonColor: '#3085d6', - cancelButtonColor: '#d33', - confirmButtonText: 'Yes, delete' - }).then((result) => { - if (result.value) { - - this.props.selectedItem.file ? - this.props.dispatch(startRemoveFile(this.props.selectedItem.id, this.props.selectedItem.drive, this.props.selectedItem.data.metadata.personalFile)) : - this.props.dispatch(startRemoveFolder(this.props.selectedItem.id, [...this.props.selectedItem.data.parentList, this.props.selectedItem.id], this.props.selectedItem.drive, parent, this.props.selectedItem.data.metadata.personalFolder)); - - } - }) - } - - render() { - - return - } -} - -const connectPropToState = (state) => ({ - selectedItem: state.selectedItem, - showSideBar: state.main.showSideBar, - selected: state.main.selected, - rightSectionMode: state.main.rightSectionMode -}) - -export default connect(connectPropToState)(RightSectionContainer) \ No newline at end of file diff --git a/src/components/RightSection/index.jsx b/src/components/RightSection/index.jsx new file mode 100644 index 0000000..5cac690 --- /dev/null +++ b/src/components/RightSection/index.jsx @@ -0,0 +1,394 @@ +import RightSection from "./RightSection"; +import RightSectionDetail from "../RightSectionDetail"; +import { + editFileMetadata, + startRemoveFile, + startRenameFile, +} from "../../actions/files"; +import { resetSelectedItem } from "../../actions/selectedItem"; +import env from "../../enviroment/envFrontEnd"; +import axios from "../../axiosInterceptor"; +import { connect } from "react-redux"; +import React from "react"; +import { setRightSectionMode } from "../../actions/main"; +import Swal from "sweetalert2"; +import { startRemoveFolder, startRenameFolder } from "../../actions/folders"; +import { setMoverID } from "../../actions/mover"; +import mobilecheck from "../../utils/mobileCheck"; +import { setMobileContextMenu } from "../../actions/mobileContextMenu"; + +class RightSectionContainer extends React.Component { + constructor(props) { + super(props); + + this.state = { + optimizing: false, + optimizing_finished: false, + optimizing_removed: false, + contextSelected: false, + }; + + this.prevID = ""; + + this.rightSectionRef = React.createRef(); + } + + getFileExtension = (filename) => { + const filenameSplit = filename.split("."); + + if (filenameSplit.length > 1) { + const extension = filenameSplit[filenameSplit.length - 1]; + + return extension.toUpperCase(); + } else { + return "Unknown"; + } + }; + + getSidebarClassName = (value) => { + if (value === "gone") { + return "section section--right section--no-animation"; + } else if (value) { + return "section section--right"; + } else { + return "section section--right section--minimized"; + } + }; + + removeTranscodeVideo = (props, e) => { + const data = { id: props.selectedItem.id }; + + axios + .delete("/file-service/transcode-video/remove", { + data, + }) + .then(() => { + this.props.dispatch( + editFileMetadata(props.selectedItem.id, { transcoded: undefined }) + ); + + this.setState(() => ({ + ...this.state, + optimizing: false, + optimizing_finished: false, + optimizing_removed: true, + })); + }) + .catch((err) => { + console.log(err); + }); + }; + + transcodeVideo = (props, e) => { + const config = { + file: { _id: props.selectedItem.id }, + }; + + const data = { file: { _id: props.selectedItem.id } }; + + this.setState(() => ({ + ...this.state, + optimizing: true, + })); + + axios + .post("/file-service/transcode-video", data, config) + .then((response) => { + const data = response.data; + + if (data === "Finished") { + this.props.dispatch( + editFileMetadata(props.selectedItem.id, { + isVideo: true, + transcoded: true, + }) + ); + + this.setState(() => ({ + ...this.state, + optimizing: false, + optimizing_finished: true, + optimizing_removed: false, + })); + } + }) + .catch((err) => { + console.log(err); + }); + }; + + getTranscodeButton = (props) => { + if (!props.selectedItem.isVideo || !env.enableVideoTranscoding) { + return undefined; + } + + if (this.state.optimizing && !this.state.optimizing_finished) { + return ( +
+ +
+ ); + } else if ( + (props.selectedItem.transcoded || this.state.optimizing_finished) && + !this.state.optimizing_removed + ) { + return ( +
+ +
+ ); + } else { + return ( +
+ +
+ ); + } + }; + + getPublicStatus = () => { + if (this.props.selectedItem.linkType === "one") { + return ( + + ); + } else { + return ; + } + }; + + resetState = () => { + if (this.prevID !== "" && this.prevID !== this.props.selectedItem.id) { + this.setState(() => ({ + ...this.state, + optimizing: false, + optimizing_finished: false, + })); + } + }; + + resetSelected = () => { + this.props.dispatch(resetSelectedItem()); + }; + + handleClickOutside = (e) => { + if ( + this.rightSectionRef && + !this.rightSectionRef.current.contains(event.target) + ) { + if (this.props.rightSectionMode === "open") { + this.props.dispatch(setRightSectionMode("close")); + this.closeContext(); + } + } + }; + + componentDidMount = () => { + document.addEventListener("mousedown", this.handleClickOutside); + }; + + componentWillUnmount = () => { + document.removeEventListener("mousedown", this.handleClickOutside); + }; + + openItem = (e) => { + if (this.props.selectedItem.file) { + this.props.fileClick( + this.props.selectedItem.id, + this.props.selectedItem.data, + false, + true + ); + } else { + this.props.folderClick( + this.props.selectedItem.id, + this.props.selectedItem.data, + true + ); + } + }; + + closeContext = () => { + this.setState(() => { + return { + ...this.state, + contextSelected: false, + }; + }); + }; + + selectContext = (e) => { + if (e) e.stopPropagation(); + if (e) e.preventDefault(); + + // if (mobilecheck()) { + + // this.props.dispatch(setMobileContextMenu(this.props.selectedItem.file, this.props.selectedItem.data)); + // return; + // } + + console.log("right props", this.props.selectedItem); + + this.setState(() => { + return { + ...this.state, + contextSelected: !this.state.contextSelected, + }; + }); + }; + + clickStopPropagation = (e) => { + if (e) e.stopPropagation(); + }; + + clickTest = (e) => { + console.log("click test"); + }; + + changeEditNameMode = async () => { + let inputValue = this.props.selectedItem.name; + + const { value: folderName } = await Swal.fire({ + title: "Enter A File Name", + input: "text", + inputValue: inputValue, + showCancelButton: true, + inputValidator: (value) => { + if (!value) { + return "Please Enter a Name"; + } + }, + }); + + if (folderName === undefined || folderName === null) { + return; + } + + //this.props.selectedItem.drive + + const parent = this.props.selectedItem.file + ? this.props.selectedItem.data.metadata.parent + : this.props.selectedItem.data.parent; + + this.props.selectedItem.file + ? this.props.dispatch( + startRenameFile( + this.props.selectedItem.id, + folderName, + this.props.selectedItem.drive + ) + ) + : this.props.dispatch( + startRenameFolder( + this.props.selectedItem.id, + folderName, + this.props.selectedItem.drive, + parent + ) + ); + + //this.props.dispatch(startRenameFolder(this.props.selectedItem.data._id, folderName, this.props.selectedItem.data.)); + }; + + startMoveFolder = async () => { + const parent = this.props.selectedItem.file + ? this.props.selectedItem.data.metadata.parent + : this.props.selectedItem.data.parent; + const isPersonal = this.props.selectedItem.file + ? this.props.selectedItem.data.metadata.personalFile + : this.props.selectedItem.data.personalFolder; + + this.props.dispatch( + setMoverID( + this.props.selectedItem.id, + parent, + this.props.selectedItem.file, + this.props.selectedItem.drive, + isPersonal + ) + ); + }; + + changeDeleteMode = async () => { + const parent = this.props.selectedItem.file + ? this.props.selectedItem.data.metadata.parent + : this.props.selectedItem.data.parent; + + Swal.fire({ + title: "Confirm Deletion", + text: "You cannot undo this action", + icon: "warning", + showCancelButton: true, + confirmButtonColor: "#3085d6", + cancelButtonColor: "#d33", + confirmButtonText: "Yes, delete", + }).then((result) => { + if (result.value) { + this.props.selectedItem.file + ? this.props.dispatch( + startRemoveFile( + this.props.selectedItem.id, + this.props.selectedItem.drive, + this.props.selectedItem.data.metadata.personalFile + ) + ) + : this.props.dispatch( + startRemoveFolder( + this.props.selectedItem.id, + [ + ...this.props.selectedItem.data.parentList, + this.props.selectedItem.id, + ], + this.props.selectedItem.drive, + parent, + this.props.selectedItem.data.metadata.personalFolder + ) + ); + } + }); + }; + + render() { + return ( + + ); + } +} + +const connectPropToState = (state) => ({ + selectedItem: state.selectedItem, + showSideBar: state.main.showSideBar, + selected: state.main.selected, + rightSectionMode: state.main.rightSectionMode, +}); + +export default connect(connectPropToState)(RightSectionContainer); diff --git a/src/components/RightSectionDetail/index.js b/src/components/RightSectionDetail/index.jsx similarity index 100% rename from src/components/RightSectionDetail/index.js rename to src/components/RightSectionDetail/index.jsx diff --git a/src/components/SettingsPage/index.js b/src/components/SettingsPage/index.jsx similarity index 100% rename from src/components/SettingsPage/index.js rename to src/components/SettingsPage/index.jsx diff --git a/src/components/ShareMenu/ShareMenu.js b/src/components/ShareMenu/ShareMenu.jsx similarity index 100% rename from src/components/ShareMenu/ShareMenu.js rename to src/components/ShareMenu/ShareMenu.jsx diff --git a/src/components/ShareMenu/index.js b/src/components/ShareMenu/index.jsx similarity index 100% rename from src/components/ShareMenu/index.js rename to src/components/ShareMenu/index.jsx diff --git a/src/components/ShareModel/index.js b/src/components/ShareModel/index.jsx similarity index 100% rename from src/components/ShareModel/index.js rename to src/components/ShareModel/index.jsx diff --git a/src/components/ShareModelWrapper/index.js b/src/components/ShareModelWrapper/index.jsx similarity index 100% rename from src/components/ShareModelWrapper/index.js rename to src/components/ShareModelWrapper/index.jsx diff --git a/src/components/Spinner/index.js b/src/components/Spinner/index.jsx similarity index 100% rename from src/components/Spinner/index.js rename to src/components/Spinner/index.jsx diff --git a/src/components/SpinnerImage/index.js b/src/components/SpinnerImage/index.jsx similarity index 100% rename from src/components/SpinnerImage/index.js rename to src/components/SpinnerImage/index.jsx diff --git a/src/components/SpinnerLogin/index.js b/src/components/SpinnerLogin/index.jsx similarity index 100% rename from src/components/SpinnerLogin/index.js rename to src/components/SpinnerLogin/index.jsx diff --git a/src/components/SpinnerPage/index.js b/src/components/SpinnerPage/index.jsx similarity index 100% rename from src/components/SpinnerPage/index.js rename to src/components/SpinnerPage/index.jsx diff --git a/src/components/Subbar/Subbar.js b/src/components/Subbar/Subbar.jsx similarity index 100% rename from src/components/Subbar/Subbar.js rename to src/components/Subbar/Subbar.jsx diff --git a/src/components/Subbar/index.js b/src/components/Subbar/index.jsx similarity index 100% rename from src/components/Subbar/index.js rename to src/components/Subbar/index.jsx diff --git a/src/components/UploadItem/UploadItem.js b/src/components/UploadItem/UploadItem.jsx similarity index 100% rename from src/components/UploadItem/UploadItem.js rename to src/components/UploadItem/UploadItem.jsx diff --git a/src/components/UploadItem/index.js b/src/components/UploadItem/index.jsx similarity index 100% rename from src/components/UploadItem/index.js rename to src/components/UploadItem/index.jsx diff --git a/src/components/UploadOverlay/UploadOverlay.js b/src/components/UploadOverlay/UploadOverlay.jsx similarity index 100% rename from src/components/UploadOverlay/UploadOverlay.js rename to src/components/UploadOverlay/UploadOverlay.jsx diff --git a/src/components/UploadOverlay/index.js b/src/components/UploadOverlay/index.jsx similarity index 100% rename from src/components/UploadOverlay/index.js rename to src/components/UploadOverlay/index.jsx diff --git a/src/components/UploadStorageSwitcher/UploadStorageSwitcher.js b/src/components/UploadStorageSwitcher/UploadStorageSwitcher.jsx similarity index 100% rename from src/components/UploadStorageSwitcher/UploadStorageSwitcher.js rename to src/components/UploadStorageSwitcher/UploadStorageSwitcher.jsx diff --git a/src/components/UploadStorageSwitcher/index.js b/src/components/UploadStorageSwitcher/index.jsx similarity index 100% rename from src/components/UploadStorageSwitcher/index.js rename to src/components/UploadStorageSwitcher/index.jsx diff --git a/src/components/Uploader/Uploader.js b/src/components/Uploader/Uploader.js deleted file mode 100644 index da37cbd..0000000 --- a/src/components/Uploader/Uploader.js +++ /dev/null @@ -1,24 +0,0 @@ -import UploadItem from ".././UploadItem"; -import React from "react"; - -const Uploader = React.forwardRef((props, ref) => ( - -
-
-

Uploading {props.uploads.length} {props.uploads.length === 1 ? "file" : "files"}

- -
-
- - {props.uploaderShow ? props.uploads.map((upload) => { - return - }) : undefined} - -
-
-)) - -export default Uploader; diff --git a/src/components/Uploader/Uploader.jsx b/src/components/Uploader/Uploader.jsx new file mode 100644 index 0000000..59974fd --- /dev/null +++ b/src/components/Uploader/Uploader.jsx @@ -0,0 +1,39 @@ +import UploadItem from "../UploadItem"; +import React from "react"; + +const Uploader = React.forwardRef((props, ref) => ( +
+
+

+ Uploading {props.uploads.length}{" "} + {props.uploads.length === 1 ? "file" : "files"} +

+ +
+
+ {props.uploaderShow + ? props.uploads.map((upload) => { + return ; + }) + : undefined} +
+
+)); + +export default Uploader; diff --git a/src/components/Uploader/index.js b/src/components/Uploader/index.jsx similarity index 100% rename from src/components/Uploader/index.js rename to src/components/Uploader/index.jsx diff --git a/src/components/VerifyEmailPage/VerifyEmailPage.js b/src/components/VerifyEmailPage/VerifyEmailPage.jsx similarity index 100% rename from src/components/VerifyEmailPage/VerifyEmailPage.js rename to src/components/VerifyEmailPage/VerifyEmailPage.jsx diff --git a/src/components/VerifyEmailPage/index.js b/src/components/VerifyEmailPage/index.jsx similarity index 100% rename from src/components/VerifyEmailPage/index.js rename to src/components/VerifyEmailPage/index.jsx diff --git a/src/routers/AppRouter.js b/src/routers/AppRouter.jsx similarity index 100% rename from src/routers/AppRouter.js rename to src/routers/AppRouter.jsx diff --git a/src/routers/PrivateRoute.js b/src/routers/PrivateRoute.jsx similarity index 100% rename from src/routers/PrivateRoute.js rename to src/routers/PrivateRoute.jsx diff --git a/src/routers/PublicRoute.js b/src/routers/PublicRoute.jsx similarity index 100% rename from src/routers/PublicRoute.js rename to src/routers/PublicRoute.jsx diff --git a/tsconfig.json b/tsconfig.json index 690a838..a7fc6fb 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -1,85 +1,25 @@ { "compilerOptions": { - /* Basic Options */ - // "incremental": true, /* Enable incremental compilation */ - "target": "es6" /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */, - "module": "CommonJS" /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */, - // "lib": [], /* Specify library files to be included in the compilation. */ - "allowJs": true /* Allow javascript files to be compiled. */, - // "checkJs": true, /* Report errors in .js files. */ - // "jsx": "preserve", /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */ - // "declaration": true, /* Generates corresponding '.d.ts' file. */ - // "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */ - // "sourceMap": true, /* Generates corresponding '.map' file. */ - // "outFile": "./", /* Concatenate and emit output to single file. */ - "outDir": "./dist" /* Redirect output structure to the directory. */, - "rootDir": "./backend" /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */, - // "composite": true, /* Enable project compilation */ - // "tsBuildInfoFile": "./", /* Specify file to store incremental compilation information */ - // "removeComments": true, /* Do not emit comments to output. */ - // "noEmit": true, /* Do not emit outputs. */ - // "importHelpers": true, /* Import emit helpers from 'tslib'. */ - // "downlevelIteration": true, /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */ - // "isolatedModules": true, /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */ - /* Strict Type-Checking Options */ - "strict": true /* Enable all strict type-checking options. */, - // "noImplicitAny": true, /* Raise error on expressions and declarations with an implied 'any' type. */ - // "strictNullChecks": true, /* Enable strict null checks. */ - // "strictFunctionTypes": true, /* Enable strict checking of function types. */ - // "strictBindCallApply": true, /* Enable strict 'bind', 'call', and 'apply' methods on functions. */ - // "strictPropertyInitialization": true, /* Enable strict checking of property initialization in classes. */ - // "noImplicitThis": true, /* Raise error on 'this' expressions with an implied 'any' type. */ - // "alwaysStrict": true, /* Parse in strict mode and emit "use strict" for each source file. */ + "target": "ES2020", + "useDefineForClassFields": true, + "lib": ["ES2020", "DOM", "DOM.Iterable"], + "module": "ESNext", + "skipLibCheck": true, - /* Additional Checks */ - // "noUnusedLocals": true, /* Report errors on unused locals. */ - // "noUnusedParameters": true, /* Report errors on unused parameters. */ - // "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */ - // "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */ + /* Bundler mode */ + "moduleResolution": "bundler", + "allowImportingTsExtensions": true, + "resolveJsonModule": true, + "isolatedModules": true, + "noEmit": true, + "jsx": "react-jsx", - /* Module Resolution Options */ - "moduleResolution": "node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */, - // "baseUrl": "./", /* Base directory to resolve non-absolute module names. */ - // "paths": {}, /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */ - // "rootDirs": [], /* List of root folders whose combined content represents the structure of the project at runtime. */ - "typeRoots": [ - "./node_modules/@types" - ] /* List of folders to include type definitions from. */, - "types": [ - "node" - ] /* Type declaration files to be included in compilation. */, - // "allowSyntheticDefaultImports": true, /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */ - "esModuleInterop": true /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */, - // "preserveSymlinks": true, /* Do not resolve the real path of symlinks. */ - // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ - /* Source Map Options */ - // "sourceRoot": "", /* Specify the location where debugger should locate TypeScript files instead of source locations. */ - // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ - // "inlineSourceMap": true, /* Emit a single file with source maps instead of having a separate file. */ - // "inlineSources": true, /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */ - - /* Experimental Options */ - // "experimentalDecorators": true, /* Enables experimental support for ES7 decorators. */ - // "emitDecoratorMetadata": true, /* Enables experimental support for emitting type metadata for decorators. */ - - /* Advanced Options */ - "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */ + /* Linting */ + "strict": true, + "noUnusedLocals": true, + "noUnusedParameters": true, + "noFallthroughCasesInSwitch": true }, - "exclude": [ - "serverUtils", - "src", - "tests", - "key", - "public", - "node_modules", - "webpack.config.js", - "dist", - "webUI", - "webUI.config.js", - "webUISetup", - "webUISetup.config.js", - "vite.config.js", - "tailwind.config.js", - "postcss.config.js" - ] + "include": ["src"], + "references": [{ "path": "./tsconfig.node.json" }] } diff --git a/tsconfig.node.json b/tsconfig.node.json new file mode 100644 index 0000000..97ede7e --- /dev/null +++ b/tsconfig.node.json @@ -0,0 +1,11 @@ +{ + "compilerOptions": { + "composite": true, + "skipLibCheck": true, + "module": "ESNext", + "moduleResolution": "bundler", + "allowSyntheticDefaultImports": true, + "strict": true + }, + "include": ["vite.config.ts"] +} diff --git a/vite.config.js b/vite.config.ts similarity index 80% rename from vite.config.js rename to vite.config.ts index f178272..adddb0a 100644 --- a/vite.config.js +++ b/vite.config.ts @@ -3,10 +3,8 @@ import react from "@vitejs/plugin-react"; export default defineConfig({ plugins: [react()], - esbuild: { - include: /\.js$/, - exclude: [], - loader: "jsx", + resolve: { + extensions: [".js", ".jsx", ".ts", ".tsx"], // Include these extensions }, server: { proxy: { diff --git a/webpack.config.js b/webpack.config.js deleted file mode 100755 index 5e25ad8..0000000 --- a/webpack.config.js +++ /dev/null @@ -1,94 +0,0 @@ -// Entry Point -> Output -const webpack = require("webpack"); -const CompressionPlugin = require("compression-webpack-plugin"); - -const MiniCssExtractPlugin = require("mini-css-extract-plugin"); -const path = require("path"); - -//console.log("node env", process.env.NODE_ENV); - -//process.env.NODE_ENV = process.env.NODE_ENV || "development" - -//console.log("node env", process.env.NODE_ENV); - -module.exports = (env) => { - //console.log("env docker", process.env.DOCKER); - - if (env === "test") { - console.log("Loading test env variables"); - require("dotenv").config({ path: ".env.test" }); - } else if (env === "development") { - console.log("Loading development env variables"); - require("dotenv").config({ path: ".env.development" }); - } else { - console.log("Loading production env variables"); - require("dotenv").config({ path: ".env.production" }); - require("dotenv").config({ path: "docker-variables.env" }); - } - - console.log("env", env); - const isProduction = env === "production"; - console.log("is prod", isProduction); - - const CSSExtract = new MiniCssExtractPlugin({ filename: "styles.css" }); - return { - entry: "./src/app.js", - output: { - path: path.join(__dirname, "public", "dist"), - filename: "bundle.js", - }, - module: { - rules: [ - { - loader: "babel-loader", - test: /\.js$/, - exclude: /node_modules/, - }, - { - test: /\.s?css$/, - use: [ - { - loader: MiniCssExtractPlugin.loader, - }, - { - loader: "css-loader", - options: { - sourceMap: true, - }, - }, - { - loader: "sass-loader", - options: { - implementation: require("dart-sass"), - sourceMap: true, - }, - }, - ], - }, - ], - }, - plugins: [ - CSSExtract, - new webpack.DefinePlugin({ - "process.env.PORT": JSON.stringify(process.env.PORT), - "process.env.REMOTE_URL": JSON.stringify(process.env.REMOTE_URL), - "process.env.ENABLE_VIDEO_TRANSCODING": JSON.stringify( - process.env.ENABLE_VIDEO_TRANSCODING - ), - "process.env.DISABLE_STORAGE": JSON.stringify( - process.env.DISABLE_STORAGE - ), - "process.env.COMMERCIAL_MODE": JSON.stringify( - process.env.COMMERCIAL_MODE - ), - }), - new CompressionPlugin(), - ], - devtool: isProduction ? "source-map" : "inline-source-map", - devServer: { - contentBase: path.join(__dirname, "public"), - historyApiFallback: true, - publicPath: "/dist/", - }, - }; -};