From 56a59ea04f8a5f2d94dc94283631fda0c5075c1f Mon Sep 17 00:00:00 2001 From: Sidney Alcantara Date: Tue, 7 Sep 2021 12:50:53 +1000 Subject: [PATCH] RowyContext -> ProjectContext, useRowy -> useTable --- src/App.tsx | 6 +- src/components/CodeEditor.tsx | 4 +- src/components/Home/TableGrid/TableCard.tsx | 2 +- src/components/Home/TableGrid/index.tsx | 2 +- .../Home/TableList/TableListItem.tsx | 2 +- src/components/Home/TableList/index.tsx | 2 +- src/components/Navigation/Breadcrumbs.tsx | 4 +- src/components/Navigation/NavDrawer.tsx | 4 +- src/components/Navigation/NavTableSection.tsx | 2 +- src/components/Settings/MigrateToV2.tsx | 4 +- src/components/SideDrawer/Form/Autosave.tsx | 8 +- src/components/SideDrawer/Form/index.tsx | 6 +- src/components/SideDrawer/index.tsx | 4 +- src/components/Table/BulkActions/index.tsx | 4 +- src/components/Table/ColumnHeader.tsx | 16 +- .../Table/ColumnMenu/FieldSettings/index.tsx | 4 +- src/components/Table/ColumnMenu/index.tsx | 4 +- src/components/Table/EmptyTable.tsx | 4 +- src/components/Table/Filters/index.tsx | 12 +- src/components/Table/FinalColumnHeader.tsx | 4 +- src/components/Table/HiddenFields.tsx | 17 ++- src/components/Table/HotKeys.tsx | 2 +- src/components/Table/Settings/Webhooks.tsx | 4 +- .../Table/TableHeader/Export/Download.tsx | 56 ++++--- .../Table/TableHeader/Export/Export.tsx | 140 +++++++++--------- .../Table/TableHeader/Export/index.tsx | 4 +- .../Extensions/ExtensionMigration.tsx | 4 +- .../TableHeader/Extensions/ExtensionModal.tsx | 41 ++--- .../Table/TableHeader/Extensions/index.tsx | 4 +- .../Table/TableHeader/ReExecute.tsx | 4 +- .../Table/TableHeader/RowHeight.tsx | 4 +- .../Table/TableHeader/TableLogs.tsx | 4 +- .../Table/TableHeader/TableSettings.tsx | 4 +- src/components/Table/TableHeader/index.tsx | 4 +- src/components/Table/editors/CodeEditor.tsx | 4 +- src/components/Table/editors/TextEditor.tsx | 4 +- .../Table/editors/withSideDrawerEditor.tsx | 4 +- .../Table/formatters/FinalColumn.tsx | 4 +- src/components/Table/index.tsx | 15 +- src/components/TableSettings/index.tsx | 4 +- .../Wizards/ImportCsvWizard/Step1Columns.tsx | 4 +- .../Wizards/ImportCsvWizard/Step3Preview.tsx | 4 +- .../Wizards/ImportCsvWizard/index.tsx | 6 +- .../Wizards/ImportWizard/Step1Columns.tsx | 4 +- .../Wizards/ImportWizard/Step3Types.tsx | 4 +- .../Wizards/ImportWizard/Step4Preview.tsx | 4 +- src/components/Wizards/ImportWizard/index.tsx | 6 +- src/components/fields/Action/ActionFab.tsx | 4 +- src/components/fields/Action/Settings.tsx | 4 +- src/components/fields/Aggregate/Settings.tsx | 4 +- .../fields/ConnectTable/Settings.tsx | 4 +- src/components/fields/Date/TableCell.tsx | 4 +- src/components/fields/DateTime/TableCell.tsx | 4 +- src/components/fields/Derivative/Settings.tsx | 4 +- .../fields/File/SideDrawerField.tsx | 6 +- src/components/fields/File/TableCell.tsx | 9 +- .../fields/Image/SideDrawerField.tsx | 6 +- src/components/fields/Image/TableCell.tsx | 6 +- src/components/fields/RichText/TableCell.tsx | 4 +- src/components/fields/SubTable/Settings.tsx | 4 +- .../fields/_withTableCell/withHeavyCell.tsx | 4 +- .../fields/_withTableCell/withPopoverCell.tsx | 4 +- .../{RowyContext.tsx => ProjectContext.tsx} | 31 ++-- src/hooks/{useRowy => useTable}/index.ts | 39 +++-- .../{useRowy => useTable}/useTableConfig.ts | 0 .../useTableData.tsx} | 43 ++---- .../{useRowy => useTable}/useUploader.ts | 0 src/pages/Home.tsx | 4 +- src/pages/Table.tsx | 9 +- 69 files changed, 311 insertions(+), 343 deletions(-) rename src/contexts/{RowyContext.tsx => ProjectContext.tsx} (86%) rename src/hooks/{useRowy => useTable}/index.ts (80%) rename src/hooks/{useRowy => useTable}/useTableConfig.ts (100%) rename src/hooks/{useRowy/useTable.tsx => useTable/useTableData.tsx} (90%) rename src/hooks/{useRowy => useTable}/useUploader.ts (100%) diff --git a/src/App.tsx b/src/App.tsx index e224265d..d19222c0 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -16,7 +16,7 @@ import Logo from "assets/Logo"; import { SnackProvider } from "contexts/SnackContext"; import ConfirmationProvider from "components/ConfirmationDialog/Provider"; import { AppProvider } from "contexts/AppContext"; -import { RowyContextProvider } from "contexts/RowyContext"; +import { ProjectContextProvider } from "contexts/ProjectContext"; import { SnackLogProvider } from "contexts/SnackLogContext"; import routes from "constants/routes"; @@ -99,7 +99,7 @@ export default function App() { routes.userManagement, ]} render={() => ( - + - + )} /> diff --git a/src/components/CodeEditor.tsx b/src/components/CodeEditor.tsx index 3a7b9b5e..34e1b486 100644 --- a/src/components/CodeEditor.tsx +++ b/src/components/CodeEditor.tsx @@ -5,7 +5,7 @@ import Editor, { useMonaco } from "@monaco-editor/react"; import { makeStyles, createStyles } from "@material-ui/styles"; import { useTheme } from "@material-ui/core"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const useStyles = makeStyles((theme) => createStyles({ @@ -41,7 +41,7 @@ export default function CodeEditor({ }: ICodeEditorProps) { const theme = useTheme(); const [initialEditorValue] = useState(value ?? ""); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const classes = useStyles(); const monacoInstance = useMonaco(); diff --git a/src/components/Home/TableGrid/TableCard.tsx b/src/components/Home/TableGrid/TableCard.tsx index 365ca29a..f0df5040 100644 --- a/src/components/Home/TableGrid/TableCard.tsx +++ b/src/components/Home/TableGrid/TableCard.tsx @@ -10,7 +10,7 @@ import { } from "@material-ui/core"; import GoIcon from "assets/icons/Go"; -import { Table } from "contexts/RowyContext"; +import { Table } from "contexts/ProjectContext"; export interface ITableCardProps extends Table { link: string; diff --git a/src/components/Home/TableGrid/index.tsx b/src/components/Home/TableGrid/index.tsx index c51325b3..f1cdf11e 100644 --- a/src/components/Home/TableGrid/index.tsx +++ b/src/components/Home/TableGrid/index.tsx @@ -6,7 +6,7 @@ import SectionHeading from "components/SectionHeading"; import TableCard from "./TableCard"; import SlideTransition from "components/Modal/SlideTransition"; -import { Table } from "contexts/RowyContext"; +import { Table } from "contexts/ProjectContext"; export interface ITableGridProps { sections: Record; diff --git a/src/components/Home/TableList/TableListItem.tsx b/src/components/Home/TableList/TableListItem.tsx index bcf143ea..3213febf 100644 --- a/src/components/Home/TableList/TableListItem.tsx +++ b/src/components/Home/TableList/TableListItem.tsx @@ -8,7 +8,7 @@ import { } from "@material-ui/core"; import GoIcon from "@material-ui/icons/ArrowForward"; -import { Table } from "contexts/RowyContext"; +import { Table } from "contexts/ProjectContext"; export interface ITableListItemProps extends Table { link: string; diff --git a/src/components/Home/TableList/index.tsx b/src/components/Home/TableList/index.tsx index 9343ba37..dafe8e6c 100644 --- a/src/components/Home/TableList/index.tsx +++ b/src/components/Home/TableList/index.tsx @@ -6,7 +6,7 @@ import SectionHeading from "components/SectionHeading"; import TableListItem from "./TableListItem"; import SlideTransition from "components/Modal/SlideTransition"; -import { Table } from "contexts/RowyContext"; +import { Table } from "contexts/ProjectContext"; export interface ITableListProps { sections: Record; diff --git a/src/components/Navigation/Breadcrumbs.tsx b/src/components/Navigation/Breadcrumbs.tsx index b49198f3..3b8d3e3c 100644 --- a/src/components/Navigation/Breadcrumbs.tsx +++ b/src/components/Navigation/Breadcrumbs.tsx @@ -11,7 +11,7 @@ import { } from "@material-ui/core"; import ArrowRightIcon from "@material-ui/icons/ChevronRight"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import useRouter from "hooks/useRouter"; import routes from "constants/routes"; import { DRAWER_COLLAPSED_WIDTH } from "components/SideDrawer"; @@ -49,7 +49,7 @@ const useStyles = makeStyles((theme) => export default function Breadcrumbs(props: BreadcrumbsProps) { const classes = useStyles(); - const { tables, tableState } = useRowyContext(); + const { tables, tableState } = useProjectContext(); const collection = tableState?.tablePath || ""; const router = useRouter(); diff --git a/src/components/Navigation/NavDrawer.tsx b/src/components/Navigation/NavDrawer.tsx index 019d6ef0..1254c272 100644 --- a/src/components/Navigation/NavDrawer.tsx +++ b/src/components/Navigation/NavDrawer.tsx @@ -21,7 +21,7 @@ import Logo from "assets/Logo"; import NavItem from "./NavItem"; import NavTableSection from "./NavTableSection"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { routes } from "constants/routes"; export const NAV_DRAWER_WIDTH = 256; @@ -35,7 +35,7 @@ export default function NavDrawer({ currentSection, ...props }: INavDrawerProps) { - const { userClaims, sections } = useRowyContext(); + const { userClaims, sections } = useProjectContext(); const closeDrawer = (e: {}) => props.onClose(e, "escapeKeyDown"); diff --git a/src/components/Navigation/NavTableSection.tsx b/src/components/Navigation/NavTableSection.tsx index 1288b2cf..8c971d1d 100644 --- a/src/components/Navigation/NavTableSection.tsx +++ b/src/components/Navigation/NavTableSection.tsx @@ -4,7 +4,7 @@ import { List, ListItemText, Collapse } from "@material-ui/core"; import ArrowDropDownIcon from "@material-ui/icons/ArrowDropDown"; import NavItem from "./NavItem"; -import { Table } from "contexts/RowyContext"; +import { Table } from "contexts/ProjectContext"; import { routes } from "constants/routes"; export interface INavDrawerItemProps { diff --git a/src/components/Settings/MigrateToV2.tsx b/src/components/Settings/MigrateToV2.tsx index 89d5bb8d..9ea29120 100644 --- a/src/components/Settings/MigrateToV2.tsx +++ b/src/components/Settings/MigrateToV2.tsx @@ -6,7 +6,7 @@ import LoadingButton from "@material-ui/lab/LoadingButton"; import OpenInNewIcon from "@material-ui/icons/OpenInNew"; import Modal from "components/Modal"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useConfirmation } from "components/ConfirmationDialog"; import { db, projectId } from "@src/firebase"; import { name } from "@root/package.json"; @@ -50,7 +50,7 @@ const migrate = async () => { }; export default function MigrateToV2() { - const { userClaims } = useRowyContext(); + const { userClaims } = useProjectContext(); const { requestConfirmation } = useConfirmation(); const [requiresMigration, setRequiresMigration] = useMigrateToV2State< diff --git a/src/components/SideDrawer/Form/Autosave.tsx b/src/components/SideDrawer/Form/Autosave.tsx index 0030095c..de996ad7 100644 --- a/src/components/SideDrawer/Form/Autosave.tsx +++ b/src/components/SideDrawer/Form/Autosave.tsx @@ -7,8 +7,8 @@ import _pickBy from "lodash/pickBy"; import { Control, UseFormMethods, useWatch } from "react-hook-form"; import { Values } from "./utils"; -import { useRowyContext } from "contexts/RowyContext"; -import { RowyState } from "hooks/useRowy"; +import { useProjectContext } from "contexts/ProjectContext"; +import { TableState } from "hooks/useTable"; export interface IAutosaveProps { control: Control; @@ -18,7 +18,7 @@ export interface IAutosaveProps { dirtyFields: UseFormMethods["formState"]["dirtyFields"]; } -const getEditables = (values: Values, tableState?: RowyState) => +const getEditables = (values: Values, tableState?: TableState) => _pick( values, (tableState && @@ -36,7 +36,7 @@ export default function Autosave({ reset, dirtyFields, }: IAutosaveProps) { - const { tableState, updateCell } = useRowyContext(); + const { tableState, updateCell } = useProjectContext(); const values = useWatch({ control }); const [debouncedValue] = useDebounce(getEditables(values, tableState), 1000, { diff --git a/src/components/SideDrawer/Form/index.tsx b/src/components/SideDrawer/Form/index.tsx index 200ae30a..87849609 100644 --- a/src/components/SideDrawer/Form/index.tsx +++ b/src/components/SideDrawer/Form/index.tsx @@ -13,14 +13,14 @@ import Reset from "./Reset"; import FieldWrapper from "./FieldWrapper"; import { useAppContext } from "contexts/AppContext"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; export interface IFormProps { values: Values; } export default function Form({ values }: IFormProps) { - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const { userDoc } = useAppContext(); const userDocHiddenFields = userDoc.state.doc?.tables?.[`${tableState!.tablePath}`]?.hiddenFields ?? []; @@ -44,7 +44,7 @@ export default function Form({ values }: IFormProps) { }); const { dirtyFields } = formState; - // const { sideDrawerRef } = useRowyContext(); + // const { sideDrawerRef } = useProjectContext(); // useEffect(() => { // const column = sideDrawerRef?.current?.cell?.column; // if (!column) return; diff --git a/src/components/SideDrawer/index.tsx b/src/components/SideDrawer/index.tsx index f75e19ae..839c8e76 100644 --- a/src/components/SideDrawer/index.tsx +++ b/src/components/SideDrawer/index.tsx @@ -13,7 +13,7 @@ import Form from "./Form"; import ErrorBoundary from "components/ErrorBoundary"; import { useStyles } from "./useStyles"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import useDoc from "hooks/useDoc"; export const DRAWER_WIDTH = 512; @@ -29,7 +29,7 @@ export type SideDrawerRef = { export default function SideDrawer() { const classes = useStyles(); - const { tableState, dataGridRef, sideDrawerRef } = useRowyContext(); + const { tableState, dataGridRef, sideDrawerRef } = useProjectContext(); const [cell, setCell] = useState(null); const [open, setOpen] = useState(false); diff --git a/src/components/Table/BulkActions/index.tsx b/src/components/Table/BulkActions/index.tsx index 03c4986a..70b3ee2a 100644 --- a/src/components/Table/BulkActions/index.tsx +++ b/src/components/Table/BulkActions/index.tsx @@ -20,7 +20,7 @@ import DeleteIcon from "@material-ui/icons/DeleteForever"; import ArrowDropUpIcon from "@material-ui/icons/ArrowDropUp"; import { useConfirmation } from "components/ConfirmationDialog/Context"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useSnackContext } from "contexts/SnackContext"; import { formatPath } from "utils/fns"; import { cloudFunction } from "firebase/callables"; @@ -102,7 +102,7 @@ const useStyles = makeStyles((theme) => export default function BulkActions({ selectedRows, columns, clearSelection }) { const classes = useStyles(); const [, setLoading] = useState(); - const { tableActions, tableState } = useRowyContext(); + const { tableActions, tableState } = useProjectContext(); const { requestConfirmation } = useConfirmation(); const snack = useSnackContext(); diff --git a/src/components/Table/ColumnHeader.tsx b/src/components/Table/ColumnHeader.tsx index 855f370c..00df02bb 100644 --- a/src/components/Table/ColumnHeader.tsx +++ b/src/components/Table/ColumnHeader.tsx @@ -19,8 +19,8 @@ import LockIcon from "@material-ui/icons/Lock"; import { FieldType } from "constants/fields"; import { getFieldProp } from "components/fields"; -import { useRowyContext } from "contexts/RowyContext"; -import { RowyOrderBy } from "hooks/useRowy"; +import { useProjectContext } from "contexts/ProjectContext"; +import { TableOrder } from "@src/hooks/useTable"; const useStyles = makeStyles((theme) => createStyles({ @@ -116,12 +116,8 @@ export default function DraggableHeaderRenderer({ }) { const classes = useStyles(); - const { - tableState, - tableActions, - userClaims, - columnMenuRef, - } = useRowyContext(); + const { tableState, tableActions, userClaims, columnMenuRef } = + useProjectContext(); const [{ isDragging }, drag] = useDrag({ item: { key: column.key, type: "COLUMN_DRAG" }, collect: (monitor) => ({ @@ -162,13 +158,13 @@ export default function DraggableHeaderRenderer({ const handleSortClick = () => { if (isAsc) { - const ordering: RowyOrderBy = [ + const ordering: TableOrder = [ { key: column.key as string, direction: "desc" }, ]; tableActions.table.orderBy(ordering); } else { - const ordering: RowyOrderBy = [ + const ordering: TableOrder = [ { key: column.key as string, direction: "asc" }, ]; tableActions.table.orderBy(ordering); diff --git a/src/components/Table/ColumnMenu/FieldSettings/index.tsx b/src/components/Table/ColumnMenu/FieldSettings/index.tsx index 290b8a6c..8bba2d30 100644 --- a/src/components/Table/ColumnMenu/FieldSettings/index.tsx +++ b/src/components/Table/ColumnMenu/FieldSettings/index.tsx @@ -9,7 +9,7 @@ import DefaultValueInput from "./DefaultValueInput"; import ErrorBoundary from "components/ErrorBoundary"; import Loading from "components/Loading"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useSnackContext } from "contexts/SnackContext"; import { useSnackLogContext } from "contexts/SnackLogContext"; import { db } from "../../../../firebase"; @@ -33,7 +33,7 @@ export default function FieldSettings(props: IMenuModalProps) { const initializable = getFieldProp("initializable", type); const { requestConfirmation } = useConfirmation(); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const snack = useSnackContext(); const snackLog = useSnackLogContext(); const appContext = useAppContext(); diff --git a/src/components/Table/ColumnMenu/index.tsx b/src/components/Table/ColumnMenu/index.tsx index a7e36af2..b1c0d6ad 100644 --- a/src/components/Table/ColumnMenu/index.tsx +++ b/src/components/Table/ColumnMenu/index.tsx @@ -23,7 +23,7 @@ import NewColumn from "./NewColumn"; import TypeChange from "./TypeChange"; import FieldSettings from "./FieldSettings"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { getFieldProp } from "components/fields"; @@ -64,7 +64,7 @@ export interface IMenuModalProps { export default function ColumnMenu() { const [modal, setModal] = useState(INITIAL_MODAL); - const { tableState, tableActions, columnMenuRef } = useRowyContext(); + const { tableState, tableActions, columnMenuRef } = useProjectContext(); const [selectedColumnHeader, setSelectedColumnHeader] = useState(null); if (columnMenuRef) diff --git a/src/components/Table/EmptyTable.tsx b/src/components/Table/EmptyTable.tsx index 90017dab..9bb0eb67 100644 --- a/src/components/Table/EmptyTable.tsx +++ b/src/components/Table/EmptyTable.tsx @@ -5,7 +5,7 @@ import AddColumnIcon from "assets/icons/AddColumn"; import { APP_BAR_HEIGHT } from "components/Navigation"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import ColumnMenu from "./ColumnMenu"; import ImportWizard from "components/Wizards/ImportWizard"; import ImportCSV from "./TableHeader/ImportCsv"; @@ -29,7 +29,7 @@ const useStyles = makeStyles((theme) => export default function EmptyTable() { const classes = useStyles(); - const { tableState, importWizardRef, columnMenuRef } = useRowyContext(); + const { tableState, importWizardRef, columnMenuRef } = useProjectContext(); if (tableState?.rows && tableState?.rows.length > 0) return ( diff --git a/src/components/Table/Filters/index.tsx b/src/components/Table/Filters/index.tsx index 1c58c90f..b5acd0f0 100644 --- a/src/components/Table/Filters/index.tsx +++ b/src/components/Table/Filters/index.tsx @@ -22,8 +22,8 @@ import MultiSelect from "@antlerengineering/multiselect"; import ButtonWithStatus from "components/ButtonWithStatus"; import { FieldType } from "constants/fields"; -import { RowyFilter } from "hooks/useRowy"; -import { useRowyContext } from "contexts/RowyContext"; +import { TableFilter } from "hooks/useTable"; +import { useProjectContext } from "contexts/ProjectContext"; import { useAppContext } from "contexts/AppContext"; import { DocActions } from "hooks/useDoc"; @@ -133,7 +133,7 @@ const UNFILTERABLES = [ FieldType.longText, ]; const Filters = () => { - const { tableState, tableActions } = useRowyContext(); + const { tableState, tableActions } = useProjectContext(); const { userDoc } = useAppContext(); useEffect(() => { @@ -160,7 +160,7 @@ const Filters = () => { const [selectedColumn, setSelectedColumn] = useState(); - const [query, setQuery] = useState({ + const [query, setQuery] = useState({ key: "", operator: "", value: "", @@ -168,7 +168,7 @@ const Filters = () => { useEffect(() => { if (selectedColumn) { - let updatedQuery: RowyFilter = { + let updatedQuery: TableFilter = { key: selectedColumn.key, operator: "", value: "", @@ -339,7 +339,7 @@ const Filters = () => { } }; - const handleUpdateFilters = (filters: RowyFilter[]) => { + const handleUpdateFilters = (filters: TableFilter[]) => { userDoc.dispatch({ action: DocActions.update, data: { diff --git a/src/components/Table/FinalColumnHeader.tsx b/src/components/Table/FinalColumnHeader.tsx index 70457a99..173d3723 100644 --- a/src/components/Table/FinalColumnHeader.tsx +++ b/src/components/Table/FinalColumnHeader.tsx @@ -4,7 +4,7 @@ import { makeStyles, createStyles } from "@material-ui/styles"; import { Grid, Button } from "@material-ui/core"; import AddColumnIcon from "assets/icons/AddColumn"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const useStyles = makeStyles((theme) => createStyles({ @@ -43,7 +43,7 @@ const useStyles = makeStyles((theme) => const FinalColumnHeader: Column["headerRenderer"] = ({ column }) => { const classes = useStyles(); - const { columnMenuRef } = useRowyContext(); + const { columnMenuRef } = useProjectContext(); if (!columnMenuRef) return null; const handleClick = ( diff --git a/src/components/Table/HiddenFields.tsx b/src/components/Table/HiddenFields.tsx index 9a04b74e..5c43fea0 100644 --- a/src/components/Table/HiddenFields.tsx +++ b/src/components/Table/HiddenFields.tsx @@ -9,7 +9,7 @@ import MultiSelect from "@antlerengineering/multiselect"; import ButtonWithStatus from "components/ButtonWithStatus"; import Column from "components/Wizards/Column"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useAppContext } from "contexts/AppContext"; import { DocActions } from "hooks/useDoc"; import { formatSubTableName } from "../../utils/fns"; @@ -37,14 +37,15 @@ const useStyles = makeStyles((theme) => "& $hiddenIcon": { opacity: 0.5 }, }, - '&[aria-selected="true"], &[aria-selected="true"].Mui-focused, &[aria-selected="true"].Mui-focusVisible': { - backgroundColor: "transparent", + '&[aria-selected="true"], &[aria-selected="true"].Mui-focused, &[aria-selected="true"].Mui-focusVisible': + { + backgroundColor: "transparent", - position: "relative", - zIndex: 1, + position: "relative", + zIndex: 1, - "& $hiddenIcon": { opacity: 1 }, - }, + "& $hiddenIcon": { opacity: 1 }, + }, }, }, @@ -56,7 +57,7 @@ export default function HiddenFields() { const classes = useStyles(); const buttonRef = useRef(null); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const { userDoc } = useAppContext(); const [open, setOpen] = useState(false); diff --git a/src/components/Table/HotKeys.tsx b/src/components/Table/HotKeys.tsx index 7ecaa7e8..9aaa07e1 100644 --- a/src/components/Table/HotKeys.tsx +++ b/src/components/Table/HotKeys.tsx @@ -2,7 +2,7 @@ import useHotkeys from "../../hooks/useHotkeys"; import { FieldType } from "constants/fields"; import { useAppContext } from "contexts/AppContext"; -// TODO: Hook up to RowyContext +// TODO: Hook up to ProjectContext const onSubmit: any = () => () => {}; /** diff --git a/src/components/Table/Settings/Webhooks.tsx b/src/components/Table/Settings/Webhooks.tsx index be81edae..c26586e2 100644 --- a/src/components/Table/Settings/Webhooks.tsx +++ b/src/components/Table/Settings/Webhooks.tsx @@ -16,7 +16,7 @@ import MenuItem from "@material-ui/core/MenuItem"; import Select from "@material-ui/core/Select"; import Switch from "@material-ui/core/Switch"; import CodeEditor from "../editors/CodeEditor"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { WEBHOOK_URL } from "../../../firebase"; import { makeId } from "../../../utils/fns"; @@ -51,7 +51,7 @@ const EmptyState = { export default function WebhooksDialog({ open, handleClose }) { const classes = useStyles(); - const { tableState, tableActions } = useRowyContext(); + const { tableState, tableActions } = useProjectContext(); const [state, setState] = useState<{ enabled: boolean; diff --git a/src/components/Table/TableHeader/Export/Download.tsx b/src/components/Table/TableHeader/Export/Download.tsx index cb6894b9..53b6d2a6 100644 --- a/src/components/Table/TableHeader/Export/Download.tsx +++ b/src/components/Table/TableHeader/Export/Download.tsx @@ -17,7 +17,7 @@ import { } from "@material-ui/core"; import { SnackContext } from "contexts/SnackContext"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { hasDataTypes } from "components/fields"; @@ -27,36 +27,34 @@ const LABEL_COLUMNS = hasDataTypes(["string", "number"]); const download = (url) => fetch(url).then((resp) => resp.blob()); -const selectedColumnsFilesReducer = (doc: any, labelColumns: any[]) => ( - accumulator: any, - currentColumn: any -) => { - const files = _get(doc, currentColumn.key); - if (!files || files.length === 0) return accumulator; - return [ - ...accumulator, - ...files.map((file, index) => ({ - ...file, - fieldKey: currentColumn.key, - name: - labelColumns.length === 0 - ? file.name - : `${currentColumn.key}/${labelColumns - .map((labelColumn) => { - const value = _get(doc, labelColumn.key); - return value && typeof value === "string" - ? value.replace(/[^a-zA-Z ]/g, "") - : ""; - }) - .join("_")}${ - files.length === 1 ? "" : `_${index}` - }.${file.name.split(".").pop()}`, - })), - ]; -}; +const selectedColumnsFilesReducer = + (doc: any, labelColumns: any[]) => (accumulator: any, currentColumn: any) => { + const files = _get(doc, currentColumn.key); + if (!files || files.length === 0) return accumulator; + return [ + ...accumulator, + ...files.map((file, index) => ({ + ...file, + fieldKey: currentColumn.key, + name: + labelColumns.length === 0 + ? file.name + : `${currentColumn.key}/${labelColumns + .map((labelColumn) => { + const value = _get(doc, labelColumn.key); + return value && typeof value === "string" + ? value.replace(/[^a-zA-Z ]/g, "") + : ""; + }) + .join("_")}${files.length === 1 ? "" : `_${index}`}.${file.name + .split(".") + .pop()}`, + })), + ]; + }; export default function Export({ query, closeModal }) { - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const snackContext = useContext(SnackContext); const [columns, setColumns] = useState([]); diff --git a/src/components/Table/TableHeader/Export/Export.tsx b/src/components/Table/TableHeader/Export/Export.tsx index 78d478fc..fcaa2376 100644 --- a/src/components/Table/TableHeader/Export/Export.tsx +++ b/src/components/Table/TableHeader/Export/Export.tsx @@ -11,94 +11,92 @@ import MultiSelect from "@antlerengineering/multiselect"; import { Button, DialogActions } from "@material-ui/core"; import { SnackContext } from "contexts/SnackContext"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { getFieldProp } from "components/fields"; -const selectedColumnsJsonReducer = (doc: any) => ( - accumulator: any, - currentColumn: any -) => { - const value = _get(doc, currentColumn.key); - return { - ...accumulator, - [currentColumn.key]: value, - }; -}; - -const selectedColumnsCsvReducer = (doc: any) => ( - accumulator: any, - currentColumn: any -) => { - const value = _get(doc, currentColumn.key); - const formatter = getFieldProp("csvExportFormatter", currentColumn.type); - if (formatter) { +const selectedColumnsJsonReducer = + (doc: any) => (accumulator: any, currentColumn: any) => { + const value = _get(doc, currentColumn.key); return { ...accumulator, - [currentColumn.name]: value ? formatter(value, currentColumn.config) : "", + [currentColumn.key]: value, }; - } - // TODO: move to field csvExportFormatter - switch (currentColumn.type) { - case FieldType.multiSelect: - return { - ...accumulator, - [currentColumn.name]: value ? value.join() : "", - }; - case FieldType.file: - case FieldType.image: + }; + +const selectedColumnsCsvReducer = + (doc: any) => (accumulator: any, currentColumn: any) => { + const value = _get(doc, currentColumn.key); + const formatter = getFieldProp("csvExportFormatter", currentColumn.type); + if (formatter) { return { ...accumulator, [currentColumn.name]: value - ? value - .map((item: { downloadURL: string }) => item.downloadURL) - .join() + ? formatter(value, currentColumn.config) : "", }; - case FieldType.connectTable: - return { - ...accumulator, - [currentColumn.name]: - value && Array.isArray(value) + } + // TODO: move to field csvExportFormatter + switch (currentColumn.type) { + case FieldType.multiSelect: + return { + ...accumulator, + [currentColumn.name]: value ? value.join() : "", + }; + case FieldType.file: + case FieldType.image: + return { + ...accumulator, + [currentColumn.name]: value ? value - .map((item: any) => - currentColumn.config.primaryKeys.reduce( - (labelAccumulator: string, currentKey: any) => - `${labelAccumulator} ${item.snapshot[currentKey]}`, - "" - ) - ) + .map((item: { downloadURL: string }) => item.downloadURL) .join() : "", - }; - case FieldType.checkbox: - return { - ...accumulator, - [currentColumn.name]: - typeof value === "boolean" ? (value ? "YES" : "NO") : "", - }; - case FieldType.dateTime: - case FieldType.date: - return { - ...accumulator, - [currentColumn.name]: value && value["toDate"] ? value.toDate() : "", - }; - case FieldType.action: - return { - ...accumulator, - [currentColumn.name]: value && value.status ? value.status : "", - }; - default: - return { - ...accumulator, - [currentColumn.name]: value ? value : "", - }; - } -}; + }; + case FieldType.connectTable: + return { + ...accumulator, + [currentColumn.name]: + value && Array.isArray(value) + ? value + .map((item: any) => + currentColumn.config.primaryKeys.reduce( + (labelAccumulator: string, currentKey: any) => + `${labelAccumulator} ${item.snapshot[currentKey]}`, + "" + ) + ) + .join() + : "", + }; + case FieldType.checkbox: + return { + ...accumulator, + [currentColumn.name]: + typeof value === "boolean" ? (value ? "YES" : "NO") : "", + }; + case FieldType.dateTime: + case FieldType.date: + return { + ...accumulator, + [currentColumn.name]: value && value["toDate"] ? value.toDate() : "", + }; + case FieldType.action: + return { + ...accumulator, + [currentColumn.name]: value && value.status ? value.status : "", + }; + default: + return { + ...accumulator, + [currentColumn.name]: value ? value : "", + }; + } + }; export default function Export({ query, closeModal }) { - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const snackContext = useContext(SnackContext); const [columns, setColumns] = useState([]); diff --git a/src/components/Table/TableHeader/Export/index.tsx b/src/components/Table/TableHeader/Export/index.tsx index 12c8cdef..7a795e27 100644 --- a/src/components/Table/TableHeader/Export/index.tsx +++ b/src/components/Table/TableHeader/Export/index.tsx @@ -13,7 +13,7 @@ import Modal from "components/Modal"; import ExportDetails from "./Export"; import DownloadDetails from "./Download"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { db } from "../../../../firebase"; import { isCollectionGroup } from "utils/fns"; @@ -57,7 +57,7 @@ export default function Export() { const classes = useStyles(); const [open, setOpen] = useState(false); const [mode, setMode] = useState<"Export" | "Download">("Export"); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const query: any = useMemo(() => { let _query = isCollectionGroup() diff --git a/src/components/Table/TableHeader/Extensions/ExtensionMigration.tsx b/src/components/Table/TableHeader/Extensions/ExtensionMigration.tsx index 777f2790..2e5816ee 100644 --- a/src/components/Table/TableHeader/Extensions/ExtensionMigration.tsx +++ b/src/components/Table/TableHeader/Extensions/ExtensionMigration.tsx @@ -8,7 +8,7 @@ import OpenInNewIcon from "@material-ui/icons/OpenInNew"; import GoIcon from "@material-ui/icons/ChevronRight"; import Modal from "components/Modal"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useAppContext } from "contexts/AppContext"; import { sparkToExtensionObjects } from "./utils"; import WIKI_LINKS from "constants/wikiLinks"; @@ -23,7 +23,7 @@ export default function ExtensionMigration({ handleUpgradeComplete, }: IExtensionMigrationProps) { const appContext = useAppContext(); - const { tableState, tableActions } = useRowyContext(); + const { tableState, tableActions } = useProjectContext(); const [isSaved, setIsSaved] = useState(false); const [isUpgrading, setIsUpgrading] = useState(false); diff --git a/src/components/Table/TableHeader/Extensions/ExtensionModal.tsx b/src/components/Table/TableHeader/Extensions/ExtensionModal.tsx index 102deb06..f20efb90 100644 --- a/src/components/Table/TableHeader/Extensions/ExtensionModal.tsx +++ b/src/components/Table/TableHeader/Extensions/ExtensionModal.tsx @@ -30,7 +30,7 @@ import CodeEditor from "../../editors/CodeEditor"; import CodeEditorHelper from "components/CodeEditorHelper"; import { useConfirmation } from "components/ConfirmationDialog"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { IExtension, triggerTypes } from "./utils"; import WIKI_LINKS from "constants/wikiLinks"; @@ -85,19 +85,17 @@ export default function ExtensionModal({ extensionObject: initialObject, }: IExtensionModalProps) { const { requestConfirmation } = useConfirmation(); - const [extensionObject, setExtensionObject] = useState( - initialObject - ); + const [extensionObject, setExtensionObject] = + useState(initialObject); const [tab, setTab] = useState("triggersRequirements"); const [validation, setValidation, validationRef] = useStateRef({ condition: true, extensionBody: true, }); - const [, setConditionEditorActive, conditionEditorActiveRef] = useStateRef( - false - ); + const [, setConditionEditorActive, conditionEditorActiveRef] = + useStateRef(false); const [, setBodyEditorActive, bodyEditorActiveRef] = useStateRef(false); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const columns = Object.keys(tableState?.columns ?? {}); const edited = !_isEqual(initialObject, extensionObject); @@ -320,9 +318,10 @@ export default function ExtensionModal({ ) { setExtensionObject({ ...extensionObject, - requiredFields: extensionObject.requiredFields.filter( - (t) => t !== field - ), + requiredFields: + extensionObject.requiredFields.filter( + (t) => t !== field + ), }); } else { setExtensionObject({ @@ -340,8 +339,8 @@ export default function ExtensionModal({ ))} {extensionObject.requiredFields.map((trigger, index) => { - const isRowyColumn = columns.includes(trigger); - if (isRowyColumn) { + const isTableColumn = columns.includes(trigger); + if (isTableColumn) { return null; } @@ -358,9 +357,10 @@ export default function ExtensionModal({ onClick={() => { setExtensionObject({ ...extensionObject, - requiredFields: extensionObject.requiredFields.filter( - (t) => t !== trigger - ), + requiredFields: + extensionObject.requiredFields.filter( + (t) => t !== trigger + ), }); }} > @@ -378,10 +378,11 @@ export default function ExtensionModal({ onChange={(event) => { setExtensionObject({ ...extensionObject, - requiredFields: extensionObject.requiredFields.map( - (value, i) => - i === index ? event.target.value : value - ), + requiredFields: + extensionObject.requiredFields.map( + (value, i) => + i === index ? event.target.value : value + ), }); }} /> diff --git a/src/components/Table/TableHeader/Extensions/index.tsx b/src/components/Table/TableHeader/Extensions/index.tsx index e75366d5..b01a7718 100644 --- a/src/components/Table/TableHeader/Extensions/index.tsx +++ b/src/components/Table/TableHeader/Extensions/index.tsx @@ -11,7 +11,7 @@ import ExtensionList from "./ExtensionList"; import ExtensionModal from "./ExtensionModal"; import ExtensionMigration from "./ExtensionMigration"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useAppContext } from "contexts/AppContext"; import { useConfirmation } from "components/ConfirmationDialog"; import { useSnackContext } from "contexts/SnackContext"; @@ -28,7 +28,7 @@ import WIKI_LINKS from "constants/wikiLinks"; export default function ExtensionsEditor() { const snack = useSnackContext(); - const { tableState, tableActions } = useRowyContext(); + const { tableState, tableActions } = useProjectContext(); const appContext = useAppContext(); const { requestConfirmation } = useConfirmation(); const currentextensionObjects = (tableState?.config.extensionObjects ?? diff --git a/src/components/Table/TableHeader/ReExecute.tsx b/src/components/Table/TableHeader/ReExecute.tsx index 911b0be5..ac77a2de 100644 --- a/src/components/Table/TableHeader/ReExecute.tsx +++ b/src/components/Table/TableHeader/ReExecute.tsx @@ -3,7 +3,7 @@ import { useState } from "react"; import TableHeaderButton from "./TableHeaderButton"; import LoopIcon from "@material-ui/icons/Loop"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { db } from "../../../firebase"; import { isCollectionGroup } from "utils/fns"; import CircularProgress from "@material-ui/core/CircularProgress"; @@ -19,7 +19,7 @@ export default function ReExecute() { setOpen(false); }; - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const query: any = isCollectionGroup() ? db.collectionGroup(tableState?.tablePath!) : db.collection(tableState?.tablePath!); diff --git a/src/components/Table/TableHeader/RowHeight.tsx b/src/components/Table/TableHeader/RowHeight.tsx index 9227b26d..0e66cd48 100644 --- a/src/components/Table/TableHeader/RowHeight.tsx +++ b/src/components/Table/TableHeader/RowHeight.tsx @@ -9,7 +9,7 @@ import { import RowHeightIcon from "assets/icons/RowHeight"; import TableHeaderButton from "./TableHeaderButton"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; export default function RowHeight() { const theme = useTheme(); @@ -20,7 +20,7 @@ export default function RowHeight() { const handleOpen = () => setOpen(true); const handleClose = () => setOpen(false); - const { tableActions, tableState } = useRowyContext(); + const { tableActions, tableState } = useProjectContext(); const rowHeight = tableState?.config.rowHeight; const updateConfig = tableActions?.table.updateConfig; diff --git a/src/components/Table/TableHeader/TableLogs.tsx b/src/components/Table/TableHeader/TableLogs.tsx index 3c3740d6..f235e350 100644 --- a/src/components/Table/TableHeader/TableLogs.tsx +++ b/src/components/Table/TableHeader/TableLogs.tsx @@ -1,7 +1,7 @@ import React, { useEffect, useRef, useState } from "react"; import useRouter from "hooks/useRouter"; import useCollection from "hooks/useCollection"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import useStateRef from "react-usestateref"; import { db } from "../../../firebase"; import { useSnackLogContext } from "contexts/SnackLogContext"; @@ -389,7 +389,7 @@ function SnackLog({ log, onClose, onOpenPanel }) { export default function TableLogs() { const router = useRouter(); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const classes = useStyles(); const [panalOpen, setPanelOpen] = useState(false); diff --git a/src/components/Table/TableHeader/TableSettings.tsx b/src/components/Table/TableHeader/TableSettings.tsx index 51e4e88b..8c700b18 100644 --- a/src/components/Table/TableHeader/TableSettings.tsx +++ b/src/components/Table/TableHeader/TableSettings.tsx @@ -6,12 +6,12 @@ import SettingsIcon from "@material-ui/icons/SettingsOutlined"; import TableSettingsDialog, { TableSettingsDialogModes, } from "components/TableSettings"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; export default function TableSettings() { const [open, setOpen] = useState(false); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); return ( <> diff --git a/src/components/Table/TableHeader/index.tsx b/src/components/Table/TableHeader/index.tsx index ab0702f2..9f1ac909 100644 --- a/src/components/Table/TableHeader/index.tsx +++ b/src/components/Table/TableHeader/index.tsx @@ -14,14 +14,14 @@ import Extensions from "./Extensions"; import ReExecute from "./ReExecute"; import { useAppContext } from "contexts/AppContext"; -import { useRowyContext, rowyUser } from "contexts/RowyContext"; +import { useProjectContext, rowyUser } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; export const TABLE_HEADER_HEIGHT = 44; export default function TableHeader() { const { currentUser } = useAppContext(); - const { tableActions, tableState, userClaims } = useRowyContext(); + const { tableActions, tableState, userClaims } = useProjectContext(); const hasDerivatives = tableState && diff --git a/src/components/Table/editors/CodeEditor.tsx b/src/components/Table/editors/CodeEditor.tsx index 8aa785b1..47d2b71d 100644 --- a/src/components/Table/editors/CodeEditor.tsx +++ b/src/components/Table/editors/CodeEditor.tsx @@ -2,7 +2,7 @@ import { useRef, useMemo, useState } from "react"; import { makeStyles, createStyles } from "@material-ui/styles"; import { useTheme } from "@material-ui/core/styles"; import Editor, { useMonaco } from "@monaco-editor/react"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { useEffect } from "react"; @@ -43,7 +43,7 @@ export default function CodeEditor(props: any) { const monacoInstance = useMonaco(); const [initialEditorValue] = useState(script ?? ""); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const classes = useStyles(); const editorRef = useRef(); diff --git a/src/components/Table/editors/TextEditor.tsx b/src/components/Table/editors/TextEditor.tsx index 2f162f28..19f8c9a7 100644 --- a/src/components/Table/editors/TextEditor.tsx +++ b/src/components/Table/editors/TextEditor.tsx @@ -6,7 +6,7 @@ import { TextField } from "@material-ui/core"; import { FieldType } from "constants/fields"; import { getCellValue } from "utils/fns"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const useStyles = makeStyles((theme) => createStyles({ @@ -33,7 +33,7 @@ const useStyles = makeStyles((theme) => ); export default function TextEditor({ row, column }: EditorProps) { - const { updateCell } = useRowyContext(); + const { updateCell } = useProjectContext(); const classes = useStyles(); const type = (column as any).config?.renderFieldType ?? (column as any).type; diff --git a/src/components/Table/editors/withSideDrawerEditor.tsx b/src/components/Table/editors/withSideDrawerEditor.tsx index 2668d6c8..df270f69 100644 --- a/src/components/Table/editors/withSideDrawerEditor.tsx +++ b/src/components/Table/editors/withSideDrawerEditor.tsx @@ -1,6 +1,6 @@ import React, { useEffect } from "react"; import { EditorProps } from "react-data-grid"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { IHeavyCellProps } from "components/fields/types"; import { getCellValue } from "utils/fns"; @@ -18,7 +18,7 @@ export default function withSideDrawerEditor( ) { return function SideDrawerEditor(props: EditorProps) { const { row, column } = props; - const { sideDrawerRef } = useRowyContext(); + const { sideDrawerRef } = useProjectContext(); useEffect(() => { if (!sideDrawerRef?.current?.open && sideDrawerRef?.current?.setOpen) diff --git a/src/components/Table/formatters/FinalColumn.tsx b/src/components/Table/formatters/FinalColumn.tsx index dfc3fd60..6365e677 100644 --- a/src/components/Table/formatters/FinalColumn.tsx +++ b/src/components/Table/formatters/FinalColumn.tsx @@ -8,7 +8,7 @@ import DeleteIcon from "@material-ui/icons/DeleteOutlined"; // import { SnackContext } from "contexts/SnackContext"; import { useConfirmation } from "components/ConfirmationDialog/Context"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import useKeyPress from "hooks/useKeyPress"; const useStyles = makeStyles((theme) => @@ -31,7 +31,7 @@ export default function FinalColumn({ row }: FormatterProps) { useStyles(); const { requestConfirmation } = useConfirmation(); - const { tableActions } = useRowyContext(); + const { tableActions } = useProjectContext(); const shiftPress = useKeyPress("Shift"); // const snack = useContext(SnackContext); diff --git a/src/components/Table/index.tsx b/src/components/Table/index.tsx index 09f33289..207bfe14 100644 --- a/src/components/Table/index.tsx +++ b/src/components/Table/index.tsx @@ -27,11 +27,11 @@ import { FieldType } from "constants/fields"; import { formatSubTableName } from "utils/fns"; import { useAppContext } from "contexts/AppContext"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import useWindowSize from "hooks/useWindowSize"; import useStyles from "./styles"; -export type RowyColumn = Column & { +export type TableColumn = Column & { isNew?: boolean; type: FieldType; [key: string]: any; @@ -43,20 +43,15 @@ const SelectColumn = { ..._SelectColumn, width: 44, maxWidth: 44 }; export default function Table() { const classes = useStyles(); - const { - tableState, - tableActions, - dataGridRef, - sideDrawerRef, - updateCell, - } = useRowyContext(); + const { tableState, tableActions, dataGridRef, sideDrawerRef, updateCell } = + useProjectContext(); const { userDoc } = useAppContext(); const userDocHiddenFields = userDoc.state.doc?.tables?.[formatSubTableName(tableState?.tablePath)] ?.hiddenFields ?? []; - const [columns, setColumns] = useState([]); + const [columns, setColumns] = useState([]); useEffect(() => { if (!tableState?.loadingColumns && tableState?.columns) { diff --git a/src/components/TableSettings/index.tsx b/src/components/TableSettings/index.tsx index 8edf9928..4bacb5a7 100644 --- a/src/components/TableSettings/index.tsx +++ b/src/components/TableSettings/index.tsx @@ -10,7 +10,7 @@ import Confirmation from "components/Confirmation"; import { FormDialog } from "@antlerengineering/form-builder"; import { tableSettings } from "./form"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import useRouter from "../../hooks/useRouter"; import { db } from "../../firebase"; import { name } from "@root/package.json"; @@ -67,7 +67,7 @@ export default function TableSettingsDialog({ }: ICreateTableDialogProps) { const classes = useStyles(); - const { settingsActions, sections, roles, tables } = useRowyContext(); + const { settingsActions, sections, roles, tables } = useProjectContext(); const sectionNames = sections ? Object.keys(sections) : []; const router = useRouter(); diff --git a/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx b/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx index 8b8315a5..d6d5bd0c 100644 --- a/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx +++ b/src/components/Wizards/ImportCsvWizard/Step1Columns.tsx @@ -21,7 +21,7 @@ import { IStepProps } from "."; import FadeList from "../FadeList"; import Column from "../Column"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { suggestType } from "../ImportWizard/utils"; @@ -88,7 +88,7 @@ export default function Step1Columns({ }: IStepProps) { const classes = useStyles(); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const tableColumns = _sortBy(Object.values(tableState?.columns ?? {}), [ "index", ]).map((column) => ({ label: column.name, value: column.key })); diff --git a/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx b/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx index ee7ed624..dc08e050 100644 --- a/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx +++ b/src/components/Wizards/ImportCsvWizard/Step3Preview.tsx @@ -8,7 +8,7 @@ import { IStepProps } from "."; import Column from "../Column"; import Cell from "../Cell"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const useStyles = makeStyles((theme) => createStyles({ @@ -69,7 +69,7 @@ const useStyles = makeStyles((theme) => export default function Step4Preview({ csvData, config }: IStepProps) { const classes = useStyles(); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); if (!tableState) return null; diff --git a/src/components/Wizards/ImportCsvWizard/index.tsx b/src/components/Wizards/ImportCsvWizard/index.tsx index c8d21a91..aa92953b 100644 --- a/src/components/Wizards/ImportCsvWizard/index.tsx +++ b/src/components/Wizards/ImportCsvWizard/index.tsx @@ -11,8 +11,8 @@ import Step1Columns from "./Step1Columns"; import Step2NewColumns from "./Step2NewColumns"; import Step3Preview from "./Step3Preview"; -import { ColumnConfig } from "hooks/useRowy/useTableConfig"; -import { useRowyContext } from "contexts/RowyContext"; +import { ColumnConfig } from "hooks/useTable/useTableConfig"; +import { useProjectContext } from "contexts/ProjectContext"; import { useSnackContext } from "contexts/SnackContext"; import { getFieldProp } from "components/fields"; @@ -46,7 +46,7 @@ export default function ImportCsvWizard({ const [open, setOpen] = useState(true); - const { tableState, tableActions } = useRowyContext(); + const { tableState, tableActions } = useProjectContext(); const { open: openSnackbar } = useSnackContext(); const [config, setConfig] = useState({ diff --git a/src/components/Wizards/ImportWizard/Step1Columns.tsx b/src/components/Wizards/ImportWizard/Step1Columns.tsx index 236b73b1..ce1ed978 100644 --- a/src/components/Wizards/ImportWizard/Step1Columns.tsx +++ b/src/components/Wizards/ImportWizard/Step1Columns.tsx @@ -24,7 +24,7 @@ import Column from "../Column"; import EmptyState from "components/EmptyState"; import AddColumnIcon from "assets/icons/AddColumn"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { suggestType } from "./utils"; @@ -40,7 +40,7 @@ export default function Step1Columns({ config, setConfig }: IStepProps) { const classes = useStyles(); // Get a list of fields from first 50 documents - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const allFields = useMemo(() => { const sample = tableState!.rows.slice(0, 50); const fields_ = new Set(); diff --git a/src/components/Wizards/ImportWizard/Step3Types.tsx b/src/components/Wizards/ImportWizard/Step3Types.tsx index 9b37d233..8eb7f254 100644 --- a/src/components/Wizards/ImportWizard/Step3Types.tsx +++ b/src/components/Wizards/ImportWizard/Step3Types.tsx @@ -10,7 +10,7 @@ import Column from "../Column"; import Cell from "../Cell"; import FieldsDropdown from "components/Table/ColumnMenu/FieldsDropdown"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { SELECTABLE_TYPES } from "./utils"; @@ -40,7 +40,7 @@ export default function Step3Types({ config, updateConfig, isXs }: IStepProps) { const handleChange = (e) => updateConfig({ [fieldToEdit]: { type: e.target.value } }); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); return (
diff --git a/src/components/Wizards/ImportWizard/Step4Preview.tsx b/src/components/Wizards/ImportWizard/Step4Preview.tsx index 622349e2..7bbc1c5a 100644 --- a/src/components/Wizards/ImportWizard/Step4Preview.tsx +++ b/src/components/Wizards/ImportWizard/Step4Preview.tsx @@ -7,7 +7,7 @@ import { IStepProps } from "."; import Column from "../Column"; import Cell from "../Cell"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const useStyles = makeStyles((theme) => createStyles({ @@ -68,7 +68,7 @@ const useStyles = makeStyles((theme) => export default function Step4Preview({ config }: IStepProps) { const classes = useStyles(); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); return (
diff --git a/src/components/Wizards/ImportWizard/index.tsx b/src/components/Wizards/ImportWizard/index.tsx index 3c0bf591..7e8abca0 100644 --- a/src/components/Wizards/ImportWizard/index.tsx +++ b/src/components/Wizards/ImportWizard/index.tsx @@ -9,8 +9,8 @@ import Step2Rename from "./Step2Rename"; import Step3Types from "./Step3Types"; import Step4Preview from "./Step4Preview"; -import { ColumnConfig } from "hooks/useRowy/useTableConfig"; -import { useRowyContext } from "contexts/RowyContext"; +import { ColumnConfig } from "hooks/useTable/useTableConfig"; +import { useProjectContext } from "contexts/ProjectContext"; export type TableColumnsConfig = { [key: string]: ColumnConfig }; @@ -30,7 +30,7 @@ export default function ImportWizard() { const theme = useTheme(); const isXs = useMediaQuery(theme.breakpoints.down("sm")); - const { tableState, tableActions, importWizardRef } = useRowyContext(); + const { tableState, tableActions, importWizardRef } = useProjectContext(); const [open, setOpen] = useState(false); if (importWizardRef) importWizardRef.current = { open, setOpen }; diff --git a/src/components/fields/Action/ActionFab.tsx b/src/components/fields/Action/ActionFab.tsx index 59004213..e0626314 100644 --- a/src/components/fields/Action/ActionFab.tsx +++ b/src/components/fields/Action/ActionFab.tsx @@ -6,7 +6,7 @@ import PlayIcon from "@material-ui/icons/PlayArrow"; import RefreshIcon from "@material-ui/icons/Refresh"; import UndoIcon from "@material-ui/icons/Undo"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { SnackContext } from "contexts/SnackContext"; import { cloudFunction } from "firebase/callables"; import { formatPath } from "utils/fns"; @@ -48,7 +48,7 @@ export default function ActionFab({ }: IActionFabProps) { const { requestConfirmation } = useConfirmation(); const { requestParams } = useActionParams(); - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const { ref } = row; const { config } = column as any; diff --git a/src/components/fields/Action/Settings.tsx b/src/components/fields/Action/Settings.tsx index 49e7cdd2..8ffbea08 100644 --- a/src/components/fields/Action/Settings.tsx +++ b/src/components/fields/Action/Settings.tsx @@ -8,7 +8,7 @@ import { } from "@material-ui/core"; import MultiSelect from "@antlerengineering/multiselect"; import FieldSkeleton from "components/SideDrawer/Form/FieldSkeleton"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const CodeEditor = lazy( () => @@ -18,7 +18,7 @@ const CodeEditor = lazy( ); const Settings = ({ config, handleChange }) => { - const { tableState, roles } = useRowyContext(); + const { tableState, roles } = useProjectContext(); const columnOptions = Object.values(tableState?.columns ?? {}).map((c) => ({ label: c.name, value: c.key, diff --git a/src/components/fields/Aggregate/Settings.tsx b/src/components/fields/Aggregate/Settings.tsx index b36d18ed..c9d8c2e9 100644 --- a/src/components/fields/Aggregate/Settings.tsx +++ b/src/components/fields/Aggregate/Settings.tsx @@ -4,7 +4,7 @@ import MultiSelect from "@antlerengineering/multiselect"; import FieldSkeleton from "components/SideDrawer/Form/FieldSkeleton"; import { FieldType } from "constants/fields"; import FieldsDropdown from "components/Table/ColumnMenu/FieldsDropdown"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const CodeEditor = lazy( () => import( @@ -13,7 +13,7 @@ const CodeEditor = lazy( ); const Settings = ({ config, handleChange }) => { - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const columnOptions = Object.values(tableState?.columns ?? {}) .filter((column) => column.type === FieldType.subTable) diff --git a/src/components/fields/ConnectTable/Settings.tsx b/src/components/fields/ConnectTable/Settings.tsx index 31479beb..e07d6276 100644 --- a/src/components/fields/ConnectTable/Settings.tsx +++ b/src/components/fields/ConnectTable/Settings.tsx @@ -8,11 +8,11 @@ import MultiSelect from "@antlerengineering/multiselect"; import { FieldType } from "constants/fields"; import { db } from "../../../firebase"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { TABLE_SCHEMAS } from "config/dbPaths"; export default function Settings({ handleChange, config }: ISettingsProps) { - const { tables } = useRowyContext(); + const { tables } = useProjectContext(); const tableOptions = _sortBy( tables?.map((t) => ({ label: `${t.section} - ${t.name}`, diff --git a/src/components/fields/Date/TableCell.tsx b/src/components/fields/Date/TableCell.tsx index c571c7b8..d6d16518 100644 --- a/src/components/fields/Date/TableCell.tsx +++ b/src/components/fields/Date/TableCell.tsx @@ -11,7 +11,7 @@ import { transformValue } from "./utils"; // DatePickerProps, // } from "@material-ui/pickers"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import BasicCell from "./BasicCell"; const useStyles = makeStyles((theme) => @@ -50,7 +50,7 @@ const useStyles = makeStyles((theme) => export default function Date_({ column, value }: IHeavyCellProps) { const classes = useStyles(); - const {} = useRowyContext(); + const {} = useProjectContext(); const transformedValue = transformValue(value); diff --git a/src/components/fields/DateTime/TableCell.tsx b/src/components/fields/DateTime/TableCell.tsx index b30b8cde..74a95041 100644 --- a/src/components/fields/DateTime/TableCell.tsx +++ b/src/components/fields/DateTime/TableCell.tsx @@ -10,7 +10,7 @@ import { transformValue } from "../Date/utils"; // DatePickerProps, // } from "@material-ui/pickers"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import BasicCell from "./BasicCell"; const useStyles = makeStyles((theme) => @@ -49,7 +49,7 @@ const useStyles = makeStyles((theme) => export default function DateTime({ column, value }: IHeavyCellProps) { const classes = useStyles(); - const {} = useRowyContext(); + const {} = useProjectContext(); const transformedValue = transformValue(value); diff --git a/src/components/fields/Derivative/Settings.tsx b/src/components/fields/Derivative/Settings.tsx index eea01e0c..de6172fe 100644 --- a/src/components/fields/Derivative/Settings.tsx +++ b/src/components/fields/Derivative/Settings.tsx @@ -4,7 +4,7 @@ import MultiSelect from "@antlerengineering/multiselect"; import FieldSkeleton from "components/SideDrawer/Form/FieldSkeleton"; import { FieldType } from "constants/fields"; import FieldsDropdown from "components/Table/ColumnMenu/FieldsDropdown"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import CodeEditorHelper from "components/CodeEditorHelper"; import WIKI_LINKS from "constants/wikiLinks"; @@ -17,7 +17,7 @@ const CodeEditor = lazy( ); const Settings = ({ config, handleChange }) => { - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); if (!tableState?.columns) return <>; const columnOptions = Object.values(tableState.columns) .filter((column) => column.type !== FieldType.subTable) diff --git a/src/components/fields/File/SideDrawerField.tsx b/src/components/fields/File/SideDrawerField.tsx index 0624dfaa..82343d56 100644 --- a/src/components/fields/File/SideDrawerField.tsx +++ b/src/components/fields/File/SideDrawerField.tsx @@ -5,7 +5,7 @@ import { Controller } from "react-hook-form"; import { format } from "date-fns"; import { useDropzone } from "react-dropzone"; -import useUploader, { FileValue } from "hooks/useRowy/useUploader"; +import useUploader, { FileValue } from "hooks/useTable/useUploader"; import { makeStyles, createStyles } from "@material-ui/styles"; import { @@ -24,7 +24,7 @@ import Confirmation from "components/Confirmation"; import { DATE_TIME_FORMAT } from "constants/dates"; import { useFieldStyles } from "components/SideDrawer/Form/utils"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const useStyles = makeStyles((theme) => createStyles({ @@ -57,7 +57,7 @@ function ControlledFileUploader({ }) { const classes = useStyles(); const fieldClasses = useFieldStyles(); - const { updateCell } = useRowyContext(); + const { updateCell } = useProjectContext(); const { uploaderState, upload, deleteUpload } = useUploader(); const {} = uploaderState; diff --git a/src/components/fields/File/TableCell.tsx b/src/components/fields/File/TableCell.tsx index 04bdc8d4..89c77949 100644 --- a/src/components/fields/File/TableCell.tsx +++ b/src/components/fields/File/TableCell.tsx @@ -18,10 +18,10 @@ import { import UploadIcon from "assets/icons/Upload"; import { useConfirmation } from "components/ConfirmationDialog"; -import useUploader, { FileValue } from "hooks/useRowy/useUploader"; +import useUploader, { FileValue } from "hooks/useTable/useUploader"; import { FileIcon } from "."; import { DATE_TIME_FORMAT } from "constants/dates"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const useStyles = makeStyles((theme) => createStyles({ @@ -63,7 +63,7 @@ export default function File_({ disabled, }: IHeavyCellProps) { const classes = useStyles(); - const { updateCell } = useRowyContext(); + const { updateCell } = useProjectContext(); const { uploaderState, upload, deleteUpload } = useUploader(); const { progress, isLoading } = uploaderState; @@ -143,8 +143,7 @@ export default function File_({ requestConfirmation({ handleConfirm: () => handleDelete(file.ref), title: "Delete File", - body: - "Are you sure you want to delete this file?", + body: "Are you sure you want to delete this file?", confirm: "Delete", }) } diff --git a/src/components/fields/Image/SideDrawerField.tsx b/src/components/fields/Image/SideDrawerField.tsx index aa6f7e8f..2226d51a 100644 --- a/src/components/fields/Image/SideDrawerField.tsx +++ b/src/components/fields/Image/SideDrawerField.tsx @@ -4,7 +4,7 @@ import clsx from "clsx"; import { Controller } from "react-hook-form"; import { useDropzone } from "react-dropzone"; -import useUploader from "hooks/useRowy/useUploader"; +import useUploader from "hooks/useTable/useUploader"; import { makeStyles, createStyles } from "@material-ui/styles"; import { @@ -23,7 +23,7 @@ import OpenIcon from "@material-ui/icons/OpenInNewOutlined"; import { IMAGE_MIME_TYPES } from "."; import Thumbnail from "components/Thumbnail"; import { useConfirmation } from "components/ConfirmationDialog"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useFieldStyles } from "components/SideDrawer/Form/utils"; const useStyles = makeStyles((theme) => @@ -108,7 +108,7 @@ function ControlledImageUploader({ }) { const classes = useStyles(); const fieldClasses = useFieldStyles(); - const { updateCell } = useRowyContext(); + const { updateCell } = useProjectContext(); const { requestConfirmation } = useConfirmation(); const { uploaderState, upload, deleteUpload } = useUploader(); diff --git a/src/components/fields/Image/TableCell.tsx b/src/components/fields/Image/TableCell.tsx index bba52807..2f991794 100644 --- a/src/components/fields/Image/TableCell.tsx +++ b/src/components/fields/Image/TableCell.tsx @@ -19,9 +19,9 @@ import DeleteIcon from "@material-ui/icons/Delete"; import OpenIcon from "@material-ui/icons/OpenInNewOutlined"; import { useConfirmation } from "components/ConfirmationDialog"; -import useUploader, { FileValue } from "hooks/useRowy/useUploader"; +import useUploader, { FileValue } from "hooks/useTable/useUploader"; import { IMAGE_MIME_TYPES } from "./index"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import Thumbnail from "components/Thumbnail"; const useStyles = makeStyles((theme) => @@ -114,7 +114,7 @@ export default function Image_({ onSubmit, disabled, }: IHeavyCellProps) { - const { tableState, updateCell } = useRowyContext(); + const { tableState, updateCell } = useProjectContext(); const { requestConfirmation } = useConfirmation(); const classes = useStyles({ rowHeight: tableState?.config?.rowHeight ?? 44 }); diff --git a/src/components/fields/RichText/TableCell.tsx b/src/components/fields/RichText/TableCell.tsx index db475aa5..f062690a 100644 --- a/src/components/fields/RichText/TableCell.tsx +++ b/src/components/fields/RichText/TableCell.tsx @@ -3,7 +3,7 @@ import { IHeavyCellProps } from "../types"; import { makeStyles, createStyles } from "@material-ui/styles"; import { Tooltip, Fade } from "@material-ui/core"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import RenderedHtml from "components/RenderedHtml"; type StylesProps = { width: number; rowHeight: number }; @@ -51,7 +51,7 @@ const useStyles = makeStyles((theme) => ); export default function RichText({ column, value }: IHeavyCellProps) { - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); const classes = useStyles({ width: column.width, rowHeight: tableState?.config?.rowHeight ?? 44, diff --git a/src/components/fields/SubTable/Settings.tsx b/src/components/fields/SubTable/Settings.tsx index 90ba3020..fa6eac62 100644 --- a/src/components/fields/SubTable/Settings.tsx +++ b/src/components/fields/SubTable/Settings.tsx @@ -1,9 +1,9 @@ import MultiSelect from "@antlerengineering/multiselect"; import { FieldType } from "constants/fields"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; const Settings = ({ config, handleChange }) => { - const { tableState } = useRowyContext(); + const { tableState } = useProjectContext(); if (!tableState?.columns) return <>; const columnOptions = Object.values(tableState.columns) .filter((column) => diff --git a/src/components/fields/_withTableCell/withHeavyCell.tsx b/src/components/fields/_withTableCell/withHeavyCell.tsx index 952b96c7..11c17d6e 100644 --- a/src/components/fields/_withTableCell/withHeavyCell.tsx +++ b/src/components/fields/_withTableCell/withHeavyCell.tsx @@ -4,7 +4,7 @@ import { IBasicCellProps, IHeavyCellProps } from "../types"; import ErrorBoundary from "components/ErrorBoundary"; import CellValidation from "components/Table/CellValidation"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { getCellValue } from "utils/fns"; @@ -22,7 +22,7 @@ export default function withHeavyCell( readOnly: boolean = false ) { return function HeavyCell(props: FormatterProps) { - const { updateCell } = useRowyContext(); + const { updateCell } = useProjectContext(); const { validationRegex, required } = (props.column as any).config; diff --git a/src/components/fields/_withTableCell/withPopoverCell.tsx b/src/components/fields/_withTableCell/withPopoverCell.tsx index 4778c312..8e9bc21b 100644 --- a/src/components/fields/_withTableCell/withPopoverCell.tsx +++ b/src/components/fields/_withTableCell/withPopoverCell.tsx @@ -11,7 +11,7 @@ import { Popover, PopoverProps } from "@material-ui/core"; import ErrorBoundary from "components/ErrorBoundary"; import CellValidation from "components/Table/CellValidation"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { FieldType } from "constants/fields"; import { getCellValue } from "utils/fns"; @@ -50,7 +50,7 @@ export default function withPopoverCell( return function PopoverCell(props: FormatterProps) { const classes = useStyles(); const { transparent, ...popoverProps } = options ?? {}; - const { updateCell } = useRowyContext(); + const { updateCell } = useProjectContext(); const { validationRegex, required } = (props.column as any).config; diff --git a/src/contexts/RowyContext.tsx b/src/contexts/ProjectContext.tsx similarity index 86% rename from src/contexts/RowyContext.tsx rename to src/contexts/ProjectContext.tsx index f20639be..66becd02 100644 --- a/src/contexts/RowyContext.tsx +++ b/src/contexts/ProjectContext.tsx @@ -3,15 +3,14 @@ import _groupBy from "lodash/groupBy"; import _sortBy from "lodash/sortBy"; import { DataGridHandle } from "react-data-grid"; import firebase from "firebase/app"; -import useRowy, { RowyActions, RowyState } from "hooks/useRowy"; +import useTable, { TableActions, TableState } from "@src/hooks/useTable"; import useSettings from "hooks/useSettings"; import { useAppContext } from "./AppContext"; import { useSnackContext } from "./SnackContext"; import { SideDrawerRef } from "components/SideDrawer"; import { ColumnMenuRef } from "components/Table/ColumnMenu"; import { ImportWizardRef } from "components/Wizards/ImportWizard"; -import _find from "lodash/find"; -import { deepen } from "utils/fns"; + export type Table = { id: string; collection: string; @@ -22,12 +21,12 @@ export type Table = { isCollectionGroup: boolean; }; -interface RowyContextProps { +interface ProjectContextProps { tables: Table[]; roles: string[]; sections: { [sectionName: string]: Table[] }; - tableState: RowyState; - tableActions: RowyActions; + tableState: TableState; + tableActions: TableActions; updateCell: ( ref: firebase.firestore.DocumentReference, fieldName: string, @@ -68,8 +67,8 @@ interface RowyContextProps { importWizardRef: React.MutableRefObject; } -const RowyContext = React.createContext>({}); -export default RowyContext; +const ProjectContext = React.createContext>({}); +export default ProjectContext; export const rowyUser = (currentUser) => { const { displayName, email, uid, emailVerified, isAnonymous, photoURL } = @@ -84,13 +83,13 @@ export const rowyUser = (currentUser) => { photoURL, }; }; -export const useRowyContext = () => useContext(RowyContext); +export const useProjectContext = () => useContext(ProjectContext); -export const RowyContextProvider: React.FC = ({ children }) => { +export const ProjectContextProvider: React.FC = ({ children }) => { const { open } = useSnackContext(); - const { tableState, tableActions } = useRowy(); - const [tables, setTables] = useState(); - const [sections, setSections] = useState(); + const { tableState, tableActions } = useTable(); + const [tables, setTables] = useState(); + const [sections, setSections] = useState(); const [settings, settingsActions] = useSettings(); const [userRoles, setUserRoles] = useState(); const [userClaims, setUserClaims] = useState(); @@ -137,7 +136,7 @@ export const RowyContextProvider: React.FC = ({ children }) => { } }, [currentUser]); - const updateCell: RowyContextProps["updateCell"] = ( + const updateCell: ProjectContextProps["updateCell"] = ( ref, fieldName, value, @@ -178,7 +177,7 @@ export const RowyContextProvider: React.FC = ({ children }) => { const importWizardRef = useRef(); return ( - { }} > {children} - + ); }; diff --git a/src/hooks/useRowy/index.ts b/src/hooks/useTable/index.ts similarity index 80% rename from src/hooks/useRowy/index.ts rename to src/hooks/useTable/index.ts index d3026a2c..56d558d2 100644 --- a/src/hooks/useRowy/index.ts +++ b/src/hooks/useTable/index.ts @@ -1,7 +1,7 @@ -import useTable from "./useTable"; +import useTableData from "./useTableData"; import useTableConfig from "./useTableConfig"; -export type RowyActions = { +export type TableActions = { // TODO: Stricter types here column: { add: Function; @@ -20,8 +20,8 @@ export type RowyActions = { }; }; -export type RowyState = { - orderBy: RowyOrderBy; +export type TableState = { + orderBy: TableOrder; tablePath: string; config: { rowHeight: number; @@ -34,42 +34,43 @@ export type RowyState = { columns: any[]; rows: { [key: string]: any }[]; queryLimit: number; - filters: RowyFilter[]; + filters: TableFilter[]; loadingRows: boolean; loadingColumns: boolean; }; -export type RowyFilter = { +export type TableFilter = { key: string; operator: "==" | "<" | ">" | ">=" | "<=" | string; value: string | number | boolean | string[]; }; -export type RowyOrderBy = { key: string; direction: "asc" | "desc" }[]; -const useRowy = ( +export type TableOrder = { key: string; direction: "asc" | "desc" }[]; + +export default function useTable( collectionName?: string, - filters?: RowyFilter[], - orderBy?: RowyOrderBy -) => { + filters?: TableFilter[], + orderBy?: TableOrder +) { const [tableConfig, configActions] = useTableConfig(collectionName); - const [tableState, tableActions] = useTable({ + const [tableState, tableActions] = useTableData({ path: collectionName, filters, orderBy, }); /** set collection path of table */ - const setTable = (collectionName: string, filters: RowyFilter[]) => { + const setTable = (collectionName: string, filters: TableFilter[]) => { if (collectionName !== tableState.path || filters !== tableState.filters) { configActions.setTable(collectionName); tableActions.setTable(collectionName, filters); } }; - const filterTable = (filters: RowyFilter[]) => { + const filterTable = (filters: TableFilter[]) => { tableActions.dispatch({ filters }); }; - const setOrder = (orderBy: RowyOrderBy) => { + const setOrder = (orderBy: TableOrder) => { tableActions.dispatch({ orderBy }); }; - const state: RowyState = { + const state: TableState = { orderBy: tableState.orderBy, tablePath: tableState.path, filters: tableState.filters, @@ -87,7 +88,7 @@ const useRowy = ( loadingRows: tableState.loading, loadingColumns: tableConfig.loading, }; - const actions: RowyActions = { + const actions: TableActions = { column: { add: configActions.addColumn, resize: configActions.resize, @@ -111,6 +112,4 @@ const useRowy = ( }; return { tableState: state, tableActions: actions }; -}; - -export default useRowy; +} diff --git a/src/hooks/useRowy/useTableConfig.ts b/src/hooks/useTable/useTableConfig.ts similarity index 100% rename from src/hooks/useRowy/useTableConfig.ts rename to src/hooks/useTable/useTableConfig.ts diff --git a/src/hooks/useRowy/useTable.tsx b/src/hooks/useTable/useTableData.tsx similarity index 90% rename from src/hooks/useRowy/useTable.tsx rename to src/hooks/useTable/useTableData.tsx index 06ef2817..cf508ee5 100644 --- a/src/hooks/useRowy/useTable.tsx +++ b/src/hooks/useTable/useTableData.tsx @@ -4,7 +4,7 @@ import Button from "@material-ui/core/Button"; import { useEffect, useReducer, useContext } from "react"; import _isEqual from "lodash/isEqual"; import firebase from "firebase/app"; -import { RowyFilter, RowyOrderBy } from "."; +import { TableFilter, TableOrder } from "."; import { SnackContext } from "contexts/SnackContext"; import { cloudFunction } from "../../firebase/callables"; import { @@ -17,7 +17,7 @@ import { import { projectId } from "../../firebase"; import _findIndex from "lodash/findIndex"; import _orderBy from "lodash/orderBy"; -import { rowyUser } from "contexts/RowyContext"; +import { rowyUser } from "contexts/ProjectContext"; import { useAppContext } from "contexts/AppContext"; const CAP = 1000; // safety paramter sets the upper limit of number of docs fetched by this hook const serverTimestamp = firebase.firestore.FieldValue.serverTimestamp; @@ -79,7 +79,7 @@ const tableInitialState = { cap: CAP, }; -const useTable = (initialOverrides: any) => { +const useTableData = (initialOverrides: any) => { const snack = useContext(SnackContext); const { currentUser } = useAppContext(); @@ -101,7 +101,7 @@ const useTable = (initialOverrides: any) => { value: string; }[], limit: number, - orderBy: RowyOrderBy + orderBy: TableOrder ) => { //unsubscribe from old path if (tableState.prevPath && tableState.path !== tableState.prevPath) { @@ -170,31 +170,12 @@ const useTable = (initialOverrides: any) => { ), }); } else if (error.code === "permission-denied") { - if (filters.length === 0) { - cloudFunction( - "callable-setRowyPersonalizedFilter", - { - table: tableState.path, - }, - (resp) => { - console.log(resp); - }, - () => { - snack.open({ - position: { horizontal: "center", vertical: "top" }, - variant: "error", - message: "You don't have permissions to see the results.", - duration: 10000, - }); - } - ); - } else - snack.open({ - position: { horizontal: "center", vertical: "top" }, - variant: "error", - message: "You don't have permissions to see the results.", - duration: 10000, - }); + snack.open({ + position: { horizontal: "center", vertical: "top" }, + variant: "error", + message: "You don't have permissions to see the results.", + duration: 10000, + }); } } ); @@ -262,7 +243,7 @@ const useTable = (initialOverrides: any) => { * @param tableCollection firestore collection path * @param filters specify filters to be applied to the query */ - const setTable = (tableCollection: string, filters?: RowyFilter) => { + const setTable = (tableCollection: string, filters?: TableFilter) => { if (tableCollection !== tableState.path) { tableDispatch({ path: tableCollection, @@ -377,4 +358,4 @@ const useTable = (initialOverrides: any) => { return [{ ...tableState, rows: orderedRows }, tableActions]; }; -export default useTable; +export default useTableData; diff --git a/src/hooks/useRowy/useUploader.ts b/src/hooks/useTable/useUploader.ts similarity index 100% rename from src/hooks/useRowy/useUploader.ts rename to src/hooks/useTable/useUploader.ts diff --git a/src/pages/Home.tsx b/src/pages/Home.tsx index c3d2e574..349b8f08 100644 --- a/src/pages/Home.tsx +++ b/src/pages/Home.tsx @@ -33,7 +33,7 @@ import AccessDenied from "components/Home/AccessDenied"; import routes from "constants/routes"; import { useAppContext } from "contexts/AppContext"; -import { useRowyContext, Table } from "contexts/RowyContext"; +import { useProjectContext, Table } from "contexts/ProjectContext"; import useDoc, { DocActions } from "hooks/useDoc"; import useBasicSearch from "hooks/useBasicSearch"; import TableSettingsDialog, { @@ -46,7 +46,7 @@ const useHomeViewState = createPersistedState("__ROWY__HOME_VIEW"); export default function HomePage() { const { userDoc } = useAppContext(); - const { tables, userClaims } = useRowyContext(); + const { tables, userClaims } = useProjectContext(); const [results, query, handleQuery] = useBasicSearch( tables ?? [], diff --git a/src/pages/Table.tsx b/src/pages/Table.tsx index 65cfb12a..15fb2054 100644 --- a/src/pages/Table.tsx +++ b/src/pages/Table.tsx @@ -13,9 +13,9 @@ import TableHeaderSkeleton from "components/Table/Skeleton/TableHeaderSkeleton"; import HeaderRowSkeleton from "components/Table/Skeleton/HeaderRowSkeleton"; import EmptyTable from "components/Table/EmptyTable"; -import { useRowyContext } from "contexts/RowyContext"; +import { useProjectContext } from "contexts/ProjectContext"; import { useAppContext } from "contexts/AppContext"; -import { RowyFilter } from "hooks/useRowy"; +import { TableFilter } from "hooks/useTable"; import useRouter from "hooks/useRouter"; import { DocActions } from "hooks/useDoc"; import ActionParamsProvider from "components/fields/Action/FormDialog/Provider"; @@ -24,7 +24,8 @@ export default function TablePage() { const router = useRouter(); const tableCollection = decodeURIComponent(router.match.params.id); - const { tableState, tableActions, sideDrawerRef, tables } = useRowyContext(); + const { tableState, tableActions, sideDrawerRef, tables } = + useProjectContext(); const { userDoc } = useAppContext(); // Find the matching section for the current route @@ -36,7 +37,7 @@ export default function TablePage() { const tableName = _find(tables, ["collection", currentTable])?.name || currentTable; - let filters: RowyFilter[] = []; + let filters: TableFilter[] = []; const parsed = queryString.parse(router.location.search); if (typeof parsed.filters === "string") { filters = JSON.parse(parsed.filters);