fixing test and styles

jaesivsm · Apr 15, 2020 · f005f35 · f005f35
1 parent 8b81915
commit f005f35
Show file tree

Hide file tree

Showing 20 changed files with 186 additions and 255 deletions.
diff --git a/jsclient/README.md b/jsclient/README.md
diff --git a/jsclient/src/Jarr.js b/jsclient/src/Jarr.js
@@ -1,26 +1,26 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux'
-import clsx from 'clsx';
+import React from "react";
+import PropTypes from "prop-types";
+import { connect } from "react-redux";
+import clsx from "clsx";
 
-import Drawer from '@material-ui/core/Drawer';
-import CssBaseline from '@material-ui/core/CssBaseline';
-import AppBar from '@material-ui/core/AppBar';
-import Toolbar from '@material-ui/core/Toolbar';
-import Typography from '@material-ui/core/Typography';
-import IconButton from '@material-ui/core/IconButton';
-import MenuIcon from '@material-ui/icons/Menu';
-import ChevronLeftIcon from '@material-ui/icons/ChevronLeft';
-import AddFeedIcon  from '@material-ui/icons/Add';
-import AddCategoryIcon from '@material-ui/icons/LibraryAdd';
-import FoldAllCategoriesIcon from '@material-ui/icons/UnfoldLess';
-import UnFoldAllCategoriesIcon from '@material-ui/icons/UnfoldMore';
+import Drawer from "@material-ui/core/Drawer";
+import CssBaseline from "@material-ui/core/CssBaseline";
+import AppBar from "@material-ui/core/AppBar";
+import Toolbar from "@material-ui/core/Toolbar";
+import Typography from "@material-ui/core/Typography";
+import IconButton from "@material-ui/core/IconButton";
+import MenuIcon from "@material-ui/icons/Menu";
+import ChevronLeftIcon from "@material-ui/icons/ChevronLeft";
+import AddFeedIcon  from "@material-ui/icons/Add";
+import AddCategoryIcon from "@material-ui/icons/LibraryAdd";
+import FoldAllCategoriesIcon from "@material-ui/icons/UnfoldLess";
+import UnFoldAllCategoriesIcon from "@material-ui/icons/UnfoldMore";
 
-import useStyles from './Jarr.styles.js';
-import Login from './features/login/Login';
-import FeedList from './features/feedlist/FeedList';
-import ClusterList from './features/clusterlist/ClusterList';
-import { toggleLeftMenu, toggleFolding } from './features/login/userSlice.js';
+import useStyles from "./Jarr.styles.js";
+import Login from "./features/login/Login";
+import FeedList from "./features/feedlist/FeedList";
+import ClusterList from "./features/clusterlist/ClusterList";
+import { toggleLeftMenu, toggleFolding } from "./features/login/userSlice.js";
 
 function mapStateToProps(state) {
   return { isLogged: !!state.login.token,
@@ -107,6 +107,6 @@ Jarr.propTypes = {
   isLeftMenuFolded: PropTypes.bool.isRequired,
   toggleDrawer: PropTypes.func.isRequired,
   toggleFolder: PropTypes.func.isRequired,
-}
+};
 
 export default connect(mapStateToProps, mapDispatchToProps)(Jarr);
diff --git a/jsclient/src/Jarr.styles.js b/jsclient/src/Jarr.styles.js
@@ -1,22 +1,22 @@
-import { makeStyles, Theme, createStyles } from '@material-ui/core/styles';
+import { makeStyles, Theme, createStyles } from "@material-ui/core/styles";
 
 const drawerWidth = 240;
 
 export default makeStyles((theme: Theme) =>
   createStyles({
     root: {
-      display: 'flex',
+      display: "flex",
     },
     appBar: {
-      transition: theme.transitions.create(['margin', 'width'], {
+      transition: theme.transitions.create(["margin", "width"], {
         easing: theme.transitions.easing.sharp,
         duration: theme.transitions.duration.leavingScreen,
       }),
     },
     appBarShift: {
       width: `calc(100% - ${drawerWidth}px)`,
       marginLeft: drawerWidth,
-      transition: theme.transitions.create(['margin', 'width'], {
+      transition: theme.transitions.create(["margin", "width"], {
         easing: theme.transitions.easing.easeOut,
         duration: theme.transitions.duration.enteringScreen,
       }),
@@ -25,7 +25,7 @@ export default makeStyles((theme: Theme) =>
       marginRight: theme.spacing(2),
     },
     hide: {
-      display: 'none',
+      display: "none",
     },
     drawer: {
       width: drawerWidth,
@@ -35,26 +35,26 @@ export default makeStyles((theme: Theme) =>
       width: drawerWidth,
     },
     drawerHeader: {
-      display: 'flex',
-      alignItems: 'center',
+      display: "flex",
+      alignItems: "center",
       padding: theme.spacing(0, 1),
       // necessary for content to be below app bar
       ...theme.mixins.toolbar,
-      justifyContent: 'flex-end',
+      justifyContent: "flex-end",
     },
     content: {
       flexGrow: 1,
       paddingTop: 88,
       padding: theme.spacing(3),
-      transition: theme.transitions.create('margin', {
+      transition: theme.transitions.create("margin", {
         easing: theme.transitions.easing.sharp,
         duration: theme.transitions.duration.leavingScreen,
       }),
       marginLeft: -drawerWidth,
     },
     contentShift: {
       paddingTop: 88,
-      transition: theme.transitions.create('margin', {
+      transition: theme.transitions.create("margin", {
         easing: theme.transitions.easing.easeOut,
         duration: theme.transitions.duration.enteringScreen,
       }),

diff --git a/jsclient/src/app/store.js b/jsclient/src/app/store.js
@@ -1,8 +1,8 @@
-import { configureStore, Action } from '@reduxjs/toolkit';
-import thunk, { ThunkAction }from 'redux-thunk';
-import userReducer from '../features/login/userSlice';
-import feedsReducer from '../features/feedlist/feedSlice';
-import clustersReducer from '../features/clusterlist/clusterSlice';
+import { configureStore, Action } from "@reduxjs/toolkit";
+import thunk, { ThunkAction }from "redux-thunk";
+import userReducer from "../features/login/userSlice";
+import feedsReducer from "../features/feedlist/feedSlice";
+import clustersReducer from "../features/clusterlist/clusterSlice";
 
 export default configureStore({
   reducer: {
@@ -13,4 +13,4 @@ export default configureStore({
   middleware: [thunk],
 });
 
-export type AppThunk = ThunkAction<void, RootState, unknown, Action<string>>
+export type AppThunk = ThunkAction<void, RootState, unknown, Action<string>>;
diff --git a/jsclient/src/const.js b/jsclient/src/const.js
@@ -1 +1 @@
-export const apiUrl = 'http://0.0.0.0:8000';
+export const apiUrl = "http://0.0.0.0:8000";
diff --git a/jsclient/src/features/clusterlist/Cluster.js b/jsclient/src/features/clusterlist/Cluster.js
@@ -1,21 +1,22 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux'
-import Typography from '@material-ui/core/Typography';
-import Link from '@material-ui/core/Link';
-import ExpansionPanel from '@material-ui/core/ExpansionPanel';
-import ExpansionPanelSummary from '@material-ui/core/ExpansionPanelSummary';
-import ExpansionPanelDetails from '@material-ui/core/ExpansionPanelDetails';
-import ExpandMoreIcon from '@material-ui/icons/ExpandMore';
-import CircularProgress from '@material-ui/core/CircularProgress';
+import React from "react";
+import PropTypes from "prop-types";
+import { connect } from "react-redux";
 
-import { doReadCluster, doUnreadCluster } from './clusterSlice';
+import Typography from "@material-ui/core/Typography";
+import Link from "@material-ui/core/Link";
+import ExpansionPanel from "@material-ui/core/ExpansionPanel";
+import ExpansionPanelSummary from "@material-ui/core/ExpansionPanelSummary";
+import ExpansionPanelDetails from "@material-ui/core/ExpansionPanelDetails";
+import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
+import CircularProgress from "@material-ui/core/CircularProgress";
+
+import { doReadCluster, doUnreadCluster } from "./clusterSlice";
 
 function mapStateToProps(state) {
   return { requestedClusterId: state.clusters.requestedClusterId,
            loadedCluster: state.clusters.loadedCluster,
   };
-};
+}
 
 const mapDispatchToProps = (dispatch) => ({
   readCluster(clusterId) {
@@ -71,7 +72,7 @@ function Cluster({ id, mainFeedTitle, mainTitle, requestedClusterId, loadedClust
         </ExpansionPanelDetails>
       </ExpansionPanel>
     );
-};
+}
 
 Cluster.propTypes = {
   id: PropTypes.number.isRequired,

diff --git a/jsclient/src/features/clusterlist/ClusterList.js b/jsclient/src/features/clusterlist/ClusterList.js
@@ -1,9 +1,9 @@
-import React, { useEffect, useState } from 'react';
-import PropTypes from 'prop-types';
-import { connect } from 'react-redux'
+import React, { useEffect, useState } from "react";
+import PropTypes from "prop-types";
+import { connect } from "react-redux"
 
-import Cluster from './Cluster';
-import { doListClusters } from './clusterSlice';
+import Cluster from "./Cluster";
+import { doListClusters } from "./clusterSlice";
 
 function mapStateToProps(state) {
   return { clusters: state.clusters.clusters,

diff --git a/jsclient/src/features/clusterlist/clusterSlice.js b/jsclient/src/features/clusterlist/clusterSlice.js
@@ -1,10 +1,11 @@
-import axios from 'axios';
-import qs from 'qs';
-import { createSlice } from '@reduxjs/toolkit';
-import { apiUrl } from '../../const.js';
+import axios from "axios";
+import qs from "qs";
+import { createSlice } from "@reduxjs/toolkit";
+import { apiUrl } from "../../const.js";
+import { AppThunk } from "../../app/store";
 
 const clusterSlice = createSlice({
-  name: 'cluster',
+  name: "cluster",
   initialState: { filters: {},
                   loadingClusterList: false,
                   clusters: [],
@@ -16,11 +17,11 @@ const clusterSlice = createSlice({
     requestedClustersList(state, action) {
       const selected = {};
       const filters = {};
-      if (!!action.payload.filters.feedId) {
-        selected.feedId = filters.feed_id = action.payload.filters.feedId;
+      if (action.payload.filters.feedId) {
+        selected.feedId = filters['feed_id'] = action.payload.filters.feedId;
 
-      } else if (!!action.payload.filters.categoryId) {
-        selected.categoryId = filters.category_id = action.payload.filters.categoryId;
+      } else if (action.payload.filters.categoryId) {
+        selected.categoryId = filters['category_id'] = action.payload.filters.categoryId;
       }
 
       return { ...state, filters, selected, loadingClusterList: true };
@@ -58,35 +59,33 @@ export const { requestedClustersList, retrievedClustersList,
 } = clusterSlice.actions;
 export default clusterSlice.reducer;
 
-export const doListClusters = (
-  filters: object,
-): AppThunk => async (dispatch, getState) => {
-  dispatch(requestedClustersList({ filters: filters }));
+export const doListClusters = (filters): AppThunk => async (dispatch, getState) => {
+  dispatch(requestedClustersList({ filters }));
   const params = qs.stringify(getState().clusters.filters);
   const result = await axios({
-    method: 'get',
-    url: apiUrl + '/clusters?' + params,
-    headers: { 'Authorization': getState().login.token },
+    method: "get",
+    url: apiUrl + "/clusters?" + params,
+    headers: { "Authorization": getState().login.token },
   });
-  dispatch(retrievedClustersList({ clusters: result.data }))
-}
+  dispatch(retrievedClustersList({ clusters: result.data }));
+};
 
-export const doReadCluster = (clusterId: number): AppThunk => async (dispatch, getState) => {
+export const doReadCluster = (clusterId): AppThunk => async (dispatch, getState) => {
   dispatch(requestedCluster({ clusterId }));
   const result = await axios({
-    method: 'get',
-    url: apiUrl + '/cluster/' + clusterId,
-    headers: { 'Authorization': getState().login.token },
+    method: "get",
+    url: apiUrl + "/cluster/" + clusterId,
+    headers: { "Authorization": getState().login.token },
   });
-  dispatch(retrievedCluster({ cluster: result.data }))
-}
+  dispatch(retrievedCluster({ cluster: result.data }));
+};
 
-export const doUnreadCluster = (clusterId: number): AppThunk => async (dispatch, getState) => {
+export const doUnreadCluster = (clusterId): AppThunk => async (dispatch, getState) => {
   dispatch(requestedUnreadCluster({ clusterId }));
   await axios({
-    method: 'put',
-    url: apiUrl + '/cluster/' + clusterId + '?read=false',
-    headers: { 'Authorization': getState().login.token },
+    method: "put",
+    url: apiUrl + "/cluster/" + clusterId + "?read=false",
+    headers: { "Authorization": getState().login.token },
   });
-  dispatch(retrievedUnreadCluster())
-}
+  dispatch(retrievedUnreadCluster());
+};
Original file line number	Diff line number	Diff line change
		@@ -1 +1 @@
		export const apiUrl = 'http://0.0.0.0:8000';
		export const apiUrl = "http://0.0.0.0:8000";