Merge pull request #85 from rclone/ui-redesign

Ui redesign

Author: negative0

.idea/inspectionProfiles/Project_Default.xml

@@ -1,15 +1,18 @@
 import axiosInstance from "../utils/API/API";
 import {
-    CHANGE_DISTRACTION_FREE_MODE,
-    CHANGE_LAYOUT_COLS,
-    GET_CONFIG_FOR_REMOTE,
-    GET_FILES_LIST,
-    GET_REMOTE_LIST,
-    REQUEST_ERROR,
-    REQUEST_SUCCESS
+	ADD_LAYOUT_CONTAINER,
+	CHANGE_ACTIVE_REMOTE_CONTAINER,
+	CHANGE_DISTRACTION_FREE_MODE,
+	CHANGE_LAYOUT_COLS,
+	GET_CONFIG_FOR_REMOTE,
+	GET_FILES_LIST,
+	GET_REMOTE_LIST,
+	REMOVE_LAYOUT_CONTAINER,
+	REQUEST_ERROR,
+	REQUEST_SUCCESS
 } from "./types";
-import {addColonAtLast, isLocalRemoteName} from "../utils/Tools";
-import {createPath} from "./explorerStateActions";
+import {addColonAtLast, isLocalRemoteName, makeUniqueID} from "../utils/Tools";
+import {createPath, removePath} from "./explorerStateActions";
 import urls from "../utils/API/endpoint";
 
 /**
@@ -110,21 +113,74 @@ export const getFiles = (remoteName, remotePath) => dispatch => {
 
 /**
  * Changes the number of columns in current layout view.
+ * @param mode          {string} Either "vertical or horizontal, defines the split type"
  * @param numCols       {number} Number of columns to create
  * @returns {Function}
  */
-export const changeNumCols = (numCols) => (dispatch) => {
+export const changeNumCols = (numCols, mode) => (dispatch) => {
     if (!numCols || numCols < 0) throw new Error(`Invalid number of cols:${numCols}`);
 
 
-    for (let i = 0; i < numCols; i++) {
-        dispatch(createPath(i.toString()))
-    }
+    // for (let i = 0; i < numCols; i++) {
+    //     dispatch(createPath(i.toString()))
+    // }
 
     dispatch({
         type: CHANGE_LAYOUT_COLS,
         payload: {
-            numCols
+            numCols, mode
+        }
+    })
+};
+
+/**
+ * Adds a new remote container.
+ * @param paneID               {int} pane ID
+ * @returns {Function}
+ */
+export const addRemoteContainer = (paneID) => (dispatch) => {
+    const uniqueID = makeUniqueID(3);
+    dispatch(createPath(uniqueID));
+    dispatch(changeActiveRemoteContainer(uniqueID, paneID));
+    dispatch({
+        type: ADD_LAYOUT_CONTAINER,
+        payload: {
+            containerID: uniqueID,
+            paneID
+        }
+    })
+};
+
+
+/**
+ * Remove a new remote container.
+ * @param containerID          {string} Container ID to remove
+ * @param paneID               {int} pane ID
+ * @returns {Function}
+ */
+export const removeRemoteContainer = (containerID, paneID) => (dispatch) => {
+	dispatch(removePath(containerID));
+    // console.log("Removing : " + containerID);
+    dispatch({
+        type: REMOVE_LAYOUT_CONTAINER,
+        payload: {
+            containerID, paneID
+        }
+    })
+};
+
+/**
+ * Change active remote container.
+ * @param containerID          {string} Container ID to remove
+ * @param paneID               {int} pane ID
+ * @returns {Function}
+ */
+export const changeActiveRemoteContainer = (containerID, paneID) => (dispatch) => {
+    dispatch({
+        type: CHANGE_ACTIVE_REMOTE_CONTAINER,
+        payload: {
+            containerID,
+            paneID
         }
     })
 };

src/actions/explorerActions.js

@@ -5,11 +5,13 @@ import {
     CHANGE_REMOTE_NAME,
     CHANGE_REMOTE_PATH,
     CHANGE_SEARCH_QUERY,
+    CHANGE_SORT_FILTER,
     CHANGE_VISIBILITY_FILTER,
     CREATE_PATH,
     NAVIGATE_BACK,
     NAVIGATE_FWD,
-    NAVIGATE_UP
+    NAVIGATE_UP,
+    REMOVE_PATH
 } from "./types";
 import {getFiles} from "./explorerActions";
 
@@ -98,6 +100,20 @@ export const createPath = (containerID) => dispatch => {
 };
 
 
+/**
+ * Creates an empty path for initialization of a container.
+ * @param containerID {string}
+ * @returns {Function}
+ */
+export const removePath = (containerID) => dispatch => {
+
+    dispatch({
+        type: REMOVE_PATH,
+        id: containerID
+    })
+};
+
+
 /**
  * Computes and requests the path for going one level up in the working directory.
  * Eg: /tmp/abc -> navigateUp -> /tmp
@@ -197,3 +213,14 @@ export const setLoadImages = (containerID, shouldLoad) => dispatch => {
     })
 };
 
+export const changeSortFilter = (containerID, sortFilter, sortFilterAscending) => dispatch => {
+    dispatch({
+        type: CHANGE_SORT_FILTER,
+        id: containerID,
+        payload: {
+            sortFilter, 
+            sortFilterAscending
+        }
+    })
+}
+

src/actions/explorerStateActions.js

@@ -7,6 +7,7 @@ export const GET_CONFIG_DUMP = 'GET_CONFIG_DUMP';
 export const GET_FILES_LIST = 'GET_FILES_LIST';
 export const CHANGE_PATH = 'CHANGE_PATH';
 export const CREATE_PATH = 'CREATE_PATH';
+export const REMOVE_PATH = 'REMOVE_PATH';
 export const CHANGE_REMOTE_NAME = 'CHANGE_REMOTE_NAME';
 export const CHANGE_REMOTE_PATH = 'CHANGE_REMOTE_PATH';
 export const NAVIGATE_UP = 'NAVIGATE_UP';
@@ -30,7 +31,11 @@ export const CHANGE_AXIOS_INTERCEPTOR = 'CHANGE_AXIOS_INTERCEPTOR';
 export const CHANGE_LOAD_IMAGES = 'CHANGE_LOAD_IMAGES';
 export const LOAD_IMAGE = 'LOAD_IMAGE';
 export const CHANGE_LAYOUT_COLS = 'CHANGE_LAYOUT_COLS';
+export const ADD_LAYOUT_CONTAINER = 'ADD_LAYOUT_CONTAINER';
+export const REMOVE_LAYOUT_CONTAINER = 'REMOVE_LAYOUT_CONTAINER';
+export const CHANGE_ACTIVE_REMOTE_CONTAINER = 'CHANGE_ACTIVE_REMOTE_CONTAINER';
 export const CHANGE_DISTRACTION_FREE_MODE = "CHANGE_DISTRACTION_FREE_MODE";
+export const CHANGE_SORT_FILTER = "CHANGE_SORT_FILTER";
 
 
 export const REQUEST_ERROR = 'ERROR';