Remove multiple unused variables

recipes/package.json

@@ -49,7 +49,7 @@
     "typescript": "^3.5.3"
   },
   "scripts": {
-    "start": "PORT=3006 react-scripts start",
+    "start": "react-scripts start",
     "build": "react-scripts build && cd build && tar czf ../frontend.tar.gz .",
     "test": "react-scripts test",
     "eject": "react-scripts eject",

recipes/src/App.tsx

@@ -1,11 +1,6 @@
-import { BrowserRouter as Router, Route, Link, NavLink, useRouteMatch, Switch } from "react-router-dom";
-import React, { useState } from 'react';
+import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
+import React from 'react';
 import { Provider } from 'react-redux';
-import CBKDrawer from './components/Drawer';
-import Button from 'components/Button';
-import Icon from 'components/Icon';
-import { DrawerAppContent } from '@rmwc/drawer';
-import {TopAppBar, TopAppBarRow, TopAppBarNavigationIcon, TopAppBarSection, TopAppBarTitle} from '@rmwc/top-app-bar'
 import Toast from 'components/Toast';
 import configureStore from 'store/configureStore';
 import './styles/app.scss';
@@ -13,17 +8,11 @@ import TopBar from 'components/TopAppBar';
 import Routes from 'route.config';
 import { Display } from "./types/ui";
 
-function Index() {
-  return <h2>Home</h2>;
-}
 
-function Users() {
-  return <h2>Users</h2>;
-}
 
 const store = configureStore();
 const { ui } = store.getState();
-ui.display
+
 const App = () => {
   return (
     <Provider store={store}>

recipes/src/components/DurationPicker/index.tsx

@@ -22,7 +22,7 @@ export const DurationPicker: React.SFC<DurationPickerProps> = ({ initialValue =
   useEffect(() => {
     setMinutes(initial.minutes())
     setHours(initial.hours())
-  }, [initialValue])
+  }, [initialValue, initial])
 
   return (
     <div className='cbk-duration'>

recipes/src/components/Input/index.tsx

@@ -1,4 +1,4 @@
-import React, { InputHTMLAttributes, ChangeEvent, forwardRef } from 'react';
+import React, { ChangeEvent, forwardRef } from 'react';
 
 import './styles.scss';
 

recipes/src/components/List/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React from 'react';
 import classnames from 'classnames';
 import { includes } from 'ramda';
 
@@ -17,7 +17,7 @@ type ListProps<T> = {
   onClick?: (item: T, index: number) => void,
 }
 
-const CBKList = <T extends any>(props: ListProps<T>) => {
+const CBKList = <T extends any>({onClick = () => {}, ...props}: ListProps<T>) => {
   return (
     <ul className={
       classnames({
@@ -36,7 +36,7 @@ const CBKList = <T extends any>(props: ListProps<T>) => {
                 'cbk-list__item--focus': index === props.focus || item.focused || (props.focusMultiple && includes(item, props.focusMultiple))
               })
             }
-            onClick={() => { props.onClick ? props.onClick(item, index) : null }}
+            onClick={() => onClick(item, index)}
           >
             {props.render(item, index)}
           </li>

recipes/src/components/RecipeCard/index.tsx

@@ -1,16 +1,15 @@
 import React from 'react';
 import Recipe from '../../types/recipes';
 import Icon from 'components/Icon';
-import { List as Ingredients } from 'components/Ingredient';
 import { ScaleTool } from 'components/Ingredient/'
 import StrikeText from 'components/StrikeText';
 import moment from 'moment';
 
 import sample_img from "sample.png";
-const API: string = process.env.REACT_APP_IMG || '';
-
 import './styles.scss';
 
+const API: string = process.env.REACT_APP_IMG || '';
+
 type RecipeCardProps = {
   recipe: Recipe,
 }

recipes/src/components/RecipeForm/index.tsx

@@ -1,15 +1,14 @@
 import React, { useState, forwardRef } from 'react';
 
-import Recipe, { Ingredient, Suggestion, _ingredient, _subRecipe, DBRecipe, _recipe } from 'types/recipes';
+import Recipe, { Ingredient, Suggestion, _ingredient, _subRecipe, DBRecipe } from 'types/recipes';
 import {
   Grid, 
   GridCell as Cell, 
   GridRow as Row
 } from '@rmwc/grid';
-import { Field, FieldArray, Formik, useField, Form, FieldArrayRenderProps, FormikValues } from 'formik';
+import { Field, FieldArray, Formik, useField, Form } from 'formik';
 import { MeasuresTypes } from 'services/measurements';
 import { Input, Textarea, ControlledInput } from 'components/Input';
-import { values, isEmpty } from 'ramda';
 import ImageUploader from 'components/ImageUploader';
 import Button from 'components/Button';
 import DialogConverter from 'components/DialogConverter';

recipes/src/components/Spinner/index.tsx

@@ -1,12 +1,10 @@
 import React from 'react';
-import { ReactComponent as LoadingIcon } from 'svgs/loading.svg';
 
 import './styles.scss';
 
 export const CBKSpinner: React.FC<{}> = () => {
   return (
     <div className="cbk-spinner">
-      {/* <LoadingIcon/> */}
       <svg
         xmlns="http://www.w3.org/2000/svg"
         version="1.1"

recipes/src/components/TagInput/index.tsx

@@ -1,5 +1,5 @@
 
-import React, { Component, useState, FunctionComponent } from 'react';
+import React, { useState, FunctionComponent } from 'react';
 import {
   ChipSet,
   Chip

recipes/src/containers/Recipes/Create/index.tsx

@@ -8,7 +8,7 @@ import { toast } from "react-toastify";
 
 import './styles.scss';
 
-import Recipe, { SubRecipe, Author, Details, _recipe, _subRecipe, _ingredient, Ingredient } from 'types/recipes';
+import Recipe, { _recipe } from 'types/recipes';
 import { scrapeRecipe, saveRecipe } from '../services';
 
 interface CreateRecipeProps {

recipes/src/containers/Recipes/Edit/index.tsx

@@ -4,7 +4,7 @@ import RecipeForm from 'components/RecipeForm';
 
 import './styles.scss';
 
-import { _recipe, _subRecipe, _ingredient, Ingredient, DBRecipe } from 'types/recipes';
+import { _recipe, DBRecipe } from 'types/recipes';
 import { getRecipeById, updateRecipe } from '../services';
 import { RouteComponentProps } from 'react-router';
 import Spinner from 'components/Spinner';

recipes/src/containers/Recipes/List/actions.ts

@@ -1,5 +1,4 @@
 import { ThunkAction } from 'redux-thunk';
-import axios from 'axios';
 import Recipe from 'types/recipes';
 import { getRecipes, deleteRecipe } from '../services';
 import { Action, ActionCreator, Dispatch } from 'redux';

recipes/src/containers/Recipes/List/index.tsx

@@ -1,4 +1,4 @@
-import React, { Component, ReactEventHandler } from "react";
+import React, { Component } from "react";
 import {
   fetchIfNeeded as fetch,
   receiveRecipes as receive,
@@ -21,7 +21,7 @@ import {
 import Button from "components/Button";
 import Card from 'components/Card';
 import RecipeCard from 'components/RecipeCard';
-import Recipe, { DBRecipe } from 'types/recipes';
+import { DBRecipe } from 'types/recipes';
 import Navbar from 'components/Navbar';
 import { Link, RouteComponentProps } from 'react-router-dom';
 import Input from 'components/Input';
@@ -46,12 +46,25 @@ interface RecipeListProps extends RouteComponentProps {
   deleteRecipe: (id: string) => undefined
 };
 
-class RecipeList extends Component<RecipeListProps, {phoneDisplay: boolean, search: string}> {
+enum Layout {
+  VerticalSplit,
+  Module,
+  List
+}
+
+type RecipeListState = {
+  phoneDisplay: boolean,
+  search: string,
+  view: Layout
+}
+
+class RecipeList extends Component<RecipeListProps, RecipeListState> {
   constructor(props: RecipeListProps) {
     super(props);
     this.state = {
       phoneDisplay: this.props.ui.display === Display.Mobile,
       search: '',
+      view: Layout.Module
     }
   }
 
@@ -155,8 +168,12 @@ class RecipeList extends Component<RecipeListProps, {phoneDisplay: boolean, sear
           <Link to='/recipes/create'>
             <Button unelevated>
               Create Recipe
+              
             </Button>
           </Link>
+          <Button icon="view_module" active></Button>
+          <Button icon="view_list"></Button>
+          <Button icon="view_sidebar"></Button>
         </Navbar>
         {
           isFetching && (<Spinner/>)

recipes/src/containers/Recipes/View/index.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React from 'react';
 import { getRecipeById } from './../services';
 import { RouteComponentProps } from 'react-router';
 

recipes/src/containers/Recipes/index.tsx

@@ -2,14 +2,6 @@ import React, { ReactType } from "react";
 
 import { Route, RouteComponentProps } from 'react-router-dom';
 import RecipeList from './List';
-import Create from './Create';
-
-
-const view = (props: any) => (
-  <div>
-    <h1>id {props.match}</h1>
-  </div>
-)
 
 interface RecipeContainerProp extends RouteComponentProps {
   routes: {

recipes/src/containers/Recipes/services.ts

@@ -1,4 +1,4 @@
-import axios, { AxiosPromise } from 'axios';
+import axios from 'axios';
 import Recipe, { DBRecipe } from 'types/recipes';
 
 //@ts-ignore

recipes/src/containers/ShoppingCart/List/index.tsx

@@ -23,20 +23,6 @@ interface ShoppingListState {
   openRemoveAll: boolean,
 }
 
-const renderItem = (actions: ActionsType) => (props: ShoppingItem) => (
-  <>
-    <span>
-      <span className='primary-text'>{props.name}</span>
-      <span className='secondary-text'>{props.recipeName && props.recipeName.join(', ')}</span>
-    </span>
-    <span className='actions'>
-      <Button icon='delete' style={{flexBasis: '20%'}} onClick={() => actions.removeItemFromCart(props.name)}/>
-      <input type='number' style={{flexBasis: '60%'}} value={props.quantity} readOnly/>
-      <span style={{flexBasis: '20%'}}>{props.unit}</span>
-    </span>
-  </>
-);
-
 class ShoppingList extends Component<ShoppingListProps, ShoppingListState> {
   constructor(props: ShoppingListProps) {
     super(props);
@@ -45,7 +31,7 @@ class ShoppingList extends Component<ShoppingListProps, ShoppingListState> {
     };
   }
   render () {
-    const { addToCart, removeItemFromCart, removeAll } = this.props;
+    const { removeAll } = this.props;
     return (
       <div className='cbk-shopping-list'>
         <Navbar
@@ -63,15 +49,6 @@ class ShoppingList extends Component<ShoppingListProps, ShoppingListState> {
           >
             <p>Are you sure you want to remove all items from shopping list ?</p>
           </Dialog>
-          {/* <List
-            dense
-            nonInteractive
-            items={this.props.items}
-            render={renderItem({
-              addToCart,
-              removeItemFromCart,
-            })}
-          /> */}
         </div>
       </div>
     )

recipes/src/containers/ShoppingCart/View/index.tsx

@@ -15,7 +15,6 @@ import shoppingCartActions, { fetchCartActionCreator, saveCartActionCreator } fr
 import { ShoppingItem, ShoppingCartState, SortType } from 'types/shopping-cart';
 import { AppState } from 'store/configureStore';
 
-import { combineMultipleItems } from '../services';
 import { GetMeasure } from 'services/measurements';
 
 import './styles.scss';
@@ -98,7 +97,6 @@ class ShoppingCartView extends React.Component<ShoppingCartViewProps, ShoppingCa
     const { selected, selectedMeasure } = this.state;
     if (selectedMeasure && selected.every(item => selectedMeasure.values.includes(item.unit))) {
       try {
-        const result = this.props.mergeItemsCart(this.state.selected, combineMultipleItems(this.state.selected));
         this.clearSelection(() => {
           this.setState({
             saveDisabled: false

recipes/src/containers/ShoppingCart/actions.ts

@@ -1,6 +1,6 @@
 import { ThunkAction } from 'redux-thunk';
 import { ShoppingRecipe, DBShoppingCart, ShoppingItem, SortType } from 'types/shopping-cart';
-import { bindActionCreators, Action, ActionCreator, Dispatch } from 'redux';
+import { Action, ActionCreator, Dispatch } from 'redux';
 import { fetchShoppingCart, saveShoppingCart } from './services';
 
 export const ADD_RECIPE_TO_CART = 'ADD_ RECIPE_TO_CART';

recipes/src/containers/ShoppingCart/services.ts

@@ -30,7 +30,7 @@ const combineItems = (a: ShoppingItem, b: ShoppingItem): ShoppingItem => {
       }
     }
     if (a.unit !== b.unit) {
-      throw Error(`cannot sum this units: ${b.unit, a.unit}`)
+      throw Error(`cannot sum this units: ${b.unit}, ${a.unit}`)
     } else {
       return {
         ...a,

recipes/src/types/shopping-cart.ts

@@ -1,4 +1,4 @@
-import Recipe, { Ingredient, SubRecipe } from './recipes';
+import { Ingredient, SubRecipe } from './recipes';
 
 export interface ShoppingItem extends Ingredient {
   recipeId?: string,