removed useCell and other cleanup

src/App.tsx

@@ -7,7 +7,7 @@ import AuthView from "./views/AuthView";
 import TableView from "./views/TableView";
 import TablesView from "./views/TablesView";
 
-import { BrowserRouter as Router, Route } from "react-router-dom";
+import { Route } from "react-router-dom";
 import { AuthProvider } from "./AuthProvider";
 import CustomBrowserRouter from "./util/CustomBrowserRouter";
 import PrivateRoute from "./util/PrivateRoute";

src/components/Table/index.tsx

@@ -6,18 +6,14 @@ import { createStyles, Theme, makeStyles } from "@material-ui/core/styles";
 import Button from "@material-ui/core/Button";
 import { FieldType, getFieldIcon } from "../Fields";
 
-import Date from "../Fields/Date";
-import Rating from "../Fields/Rating";
-import CheckBox from "../Fields/CheckBox";
-import UrlLink from "../Fields/UrlLink";
 import ColumnEditor from "./ColumnEditor/index";
 
 import {
   cellFormatter,
   onCellSelected,
   onGridRowsUpdated,
-  copyPaste,
   singleSelectEditor,
+  editable,
 } from "./grid-fns";
 const useStyles = makeStyles(Theme =>
   createStyles({
@@ -95,10 +91,10 @@ function Table(props: any) {
       width: 220,
       key: column.fieldName,
       name: column.columnName,
-      editable: true,
+      editable: editable(column.type),
       resizable: true,
       headerRenderer: headerRenderer,
-      formatter: cellFormatter(column.type, column.fieldName),
+      formatter: cellFormatter(column.type, column.key),
       editor:
         column.type === FieldType.singleSelect
           ? singleSelectEditor(column.options)
@@ -112,16 +108,16 @@ function Table(props: any) {
       width: 160,
       headerRenderer: headerRenderer,
     });
-    const rows = tableState.rows;
+    const rows = tableState.rows; //.map((row: any) => ({ height: 100, ...row }));
     return (
       <>
         <ReactDataGrid
+          rowHeight={60}
           columns={columns}
           rowGetter={i => rows[i]}
           rowsCount={rows.length}
           onGridRowsUpdated={onGridRowsUpdated}
           enableCellSelect={true}
-          onCellCopyPaste={copyPaste}
           minHeight={500}
           onCellSelected={onCellSelected}
           onColumnResize={(idx, width) =>

src/firebase/config.ts

@@ -1,8 +1,8 @@
 const STAGING_PROJECT_NAME = "antler-vc";
-const PRODUCTION_PROJECT_NAME = STAGING_PROJECT_NAME;
+//const PRODUCTION_PROJECT_NAME = STAGING_PROJECT_NAME;
 
 const stagingKey = "AIzaSyCADXbyMviWpJ_jPp4leEYMffL70Ahxo_k";
-const productionKey = stagingKey;
+//const productionKey = stagingKey;
 
 export const stagingConfig = {
   apiKey: stagingKey,

src/hooks/useFiretable/index.ts

@@ -1,9 +1,7 @@
 import useTable from "./useTable";
 import useTableConfig from "./useTableConfig";
-import useCell, { Cell } from "./useCell";
 
 export type FiretableActions = {
-  cell: { set: Function; update: Function };
   column: {
     add: Function;
     resize: Function;
@@ -16,7 +14,6 @@ export type FiretableActions = {
 };
 
 export type FiretableState = {
-  cell: Cell;
   columns: any;
   rows: any;
 };
@@ -26,20 +23,16 @@ const useFiretable = (collectionName: string) => {
   const [tableState, tableActions] = useTable({
     path: collectionName,
   });
-  const [cellState, cellActions] = useCell({});
 
   const setTable = (collectionName: string) => {
     configActions.setTable(collectionName);
     tableActions.setTable(collectionName);
-    cellActions.set(null);
   };
   const state: FiretableState = {
-    cell: cellState.cell,
     columns: tableConfig.columns,
     rows: tableState.rows,
   };
   const actions: FiretableActions = {
-    cell: { ...cellActions },
     column: {
       add: configActions.add,
       resize: configActions.resize,

src/hooks/useFiretable/useCell.ts

@@ -1,57 +0,0 @@
-import { db } from "../../firebase";
-import { useEffect, useReducer } from "react";
-import equals from "ramda/es/equals";
-
-export type Cell = {
-  fieldName: string;
-  rowIndex: number;
-  docRef: firebase.firestore.DocumentReference;
-  value: any;
-};
-
-const cellReducer = (prevState: any, newProps: any) => {
-  return { ...prevState, ...newProps };
-};
-const cellIntialState = {
-  prevCell: null,
-  cell: null,
-};
-
-const updateCell = (cell: Cell) => {
-  cell.docRef.update({ [cell.fieldName]: cell.value });
-};
-const useCell = (intialOverrides: any) => {
-  const [cellState, cellDispatch] = useReducer(cellReducer, {
-    ...cellIntialState,
-    ...intialOverrides,
-  });
-  useEffect(() => {
-    const { prevCell, updatedValue } = cellState;
-    // check for change
-    if (
-      updatedValue !== null &&
-      updatedValue !== undefined &&
-      prevCell &&
-      prevCell.value !== updatedValue
-    ) {
-      updateCell({ ...prevCell, value: updatedValue });
-      cellDispatch({ updatedValue: null });
-    }
-  }, [cellState.cell]);
-  const set = (cell: Cell | null) => {
-    cellDispatch({ prevCell: cellState.cell, cell });
-  };
-  const update = (value: any) => {
-    cellDispatch({ updatedValue: value });
-  };
-
-  const updateFirestore = (cell: Cell) => {
-    cellDispatch({ cell: null });
-    updateCell(cell);
-  };
-  const actions = { set, update, updateFirestore };
-
-  return [cellState, actions];
-};
-
-export default useCell;

src/hooks/useFiretable/useTable.ts

@@ -2,7 +2,6 @@ import { db } from "../../firebase";
 
 import { useEffect, useReducer } from "react";
 import equals from "ramda/es/equals";
-import { Cell } from "./useCell";
 import firebase from "firebase/app";
 const CAP = 500;
 

src/hooks/useFiretable/useTableConfig.ts

@@ -12,7 +12,8 @@ const useTableConfig = (tablePath: string) => {
     if (doc && columns !== doc.columns) {
       documentDispatch({ columns: doc.columns });
     }
-  }, [tableConfigState]);
+  }, [tableConfigState.doc]);
+
   const setTable = (table: string) => {
     documentDispatch({ path: `${table}/_FIRETABLE_`, columns: [], doc: null });
   };

src/views/TableView.tsx

@@ -1,4 +1,4 @@
-import React, { useEffect } from "react";
+import React from "react";
 
 import Navigation from "../components/Navigation";
 import Table from "../components/Table";

src/views/TablesView.tsx

@@ -35,7 +35,7 @@ const useStyles = makeStyles(() =>
 
 // TODO: Create an interface for props
 const TablesView = (props: any) => {
-  const [settings, createTable] = useSettings();
+  const [settings] = useSettings();
   const tables = settings.tables;
   const classes = useStyles();
   const router = useRouter();