From 2dde3f30c35f35a85daaed489894eee188598f60 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 17:36:21 -0800 Subject: [PATCH 1/9] Wrapped the table and chairs into new div element --- src/Containers/SquareTable/SquareTable.tsx | 12 +++++++++++- 1 file changed, 11 insertions(+), 1 deletion(-) diff --git a/src/Containers/SquareTable/SquareTable.tsx b/src/Containers/SquareTable/SquareTable.tsx index cfca5f86f..42f7fa269 100644 --- a/src/Containers/SquareTable/SquareTable.tsx +++ b/src/Containers/SquareTable/SquareTable.tsx @@ -296,7 +296,10 @@ export const SquareTable: React.FC = ({ }; return ( -
+ + {/** chairs top */} = ({ tableUse={tableUse} selectedIndex={selectedIndex} /> +
); }; @@ -379,6 +383,12 @@ const getOccupancyColor: getOccupancyColorType = (occupancyStatus) => { } }; +interface ITableContainer { + relativeSize: number; +} + +const TableContainer = styled.div``; + /** * variables for the styled components */ From 91e87d106be821cd9e9ca0270d6a141803939bb4 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 18:10:52 -0800 Subject: [PATCH 2/9] Rename ArrayIndex to TableIndex --- src/Containers/SquareTable/SquareTable.tsx | 25 ++++++++++++++-------- 1 file changed, 16 insertions(+), 9 deletions(-) diff --git a/src/Containers/SquareTable/SquareTable.tsx b/src/Containers/SquareTable/SquareTable.tsx index 42f7fa269..85fdcd0b4 100644 --- a/src/Containers/SquareTable/SquareTable.tsx +++ b/src/Containers/SquareTable/SquareTable.tsx @@ -24,7 +24,7 @@ type getSquareTableSizeType = ( type getRectangleTableType = (top: number, bottom: number, left: number, right : number) => number; type addInvisibleChairs = ( - invisibileChairs: Array, + invisibleChairs: Array, targetSize: number, position: Position, ) => void; @@ -75,9 +75,9 @@ export interface ISquareTable { */ tableUse: tableUseTypes; /** - * Array index number for this table + * The current table index in array of tables. */ - arrayIndex?: number; + TableIndex?: number; /** * Index number for the currently selected table */ @@ -119,7 +119,7 @@ export const SquareTable: React.FC = ({ relativeSize = 1.0, isSquare = false, tableUse = 'TableForManagement', - arrayIndex = 0, + TableIndex = 0, selectedIndex = -1, onTableClick, onChairClick, @@ -134,7 +134,7 @@ export const SquareTable: React.FC = ({ * selectedIndex number matches the arrayIndex number for this table */ useEffect(() => { - if (selectedIndex === arrayIndex) { + if (selectedIndex === TableIndex) { if (tableBodyRef != null) { tableBodyRef.current.focus(); } @@ -167,7 +167,7 @@ export const SquareTable: React.FC = ({ * parameter */ const callOnTableClick: callOnTableClickType = () => - onTableClick(arrayIndex); + onTableClick(TableIndex); /** * Determines how many chairs to put per each side @@ -232,7 +232,7 @@ export const SquareTable: React.FC = ({ relativeSize, tableUse, chairIndex: invisibileChairs.length, - tableIndex: arrayIndex, + tableIndex: TableIndex, selectedIndex, onChairClick, }); @@ -298,7 +298,9 @@ export const SquareTable: React.FC = ({ return ( {/** chairs top */} { interface ITableContainer { relativeSize: number; + tableIndex: number; + selectedIndex: number; } -const TableContainer = styled.div``; +const TableContainer = styled.div` + + +`; /** * variables for the styled components From a4cf5552c1bacbc43d4f8f56f0dad4bce67f5b1d Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 18:12:36 -0800 Subject: [PATCH 3/9] Rename ArrayIndex to TableIndex --- src/Containers/EditDraggableCanvas/_DraggableTable.tsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Containers/EditDraggableCanvas/_DraggableTable.tsx b/src/Containers/EditDraggableCanvas/_DraggableTable.tsx index 0cf979476..157296cc1 100644 --- a/src/Containers/EditDraggableCanvas/_DraggableTable.tsx +++ b/src/Containers/EditDraggableCanvas/_DraggableTable.tsx @@ -153,7 +153,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - arrayIndex={arrayIndex} + TableIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} @@ -171,7 +171,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - arrayIndex={arrayIndex} + TableIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} @@ -189,7 +189,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - arrayIndex={arrayIndex} + TableIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} From 084e32c177e89f401a17b3d3c8bbcffdb0ca9366 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 18:54:44 -0800 Subject: [PATCH 4/9] Use Storybook action for tables, instead function. --- .../SquareTable/SquareTable.stories.tsx | 26 +++++++++---------- 1 file changed, 13 insertions(+), 13 deletions(-) diff --git a/src/Containers/SquareTable/SquareTable.stories.tsx b/src/Containers/SquareTable/SquareTable.stories.tsx index eddd1335f..16986d612 100644 --- a/src/Containers/SquareTable/SquareTable.stories.tsx +++ b/src/Containers/SquareTable/SquareTable.stories.tsx @@ -1,7 +1,7 @@ import React from 'react'; import { Meta, Story } from '@storybook/react'; import { ISquareTable, SquareTable } from '@Containers'; - +import {action} from "@storybook/addon-actions"; export default { title: 'Components/TableManagement/SquareTable', @@ -10,13 +10,13 @@ export default { const Template: Story = (args) => ; -/** - * Prints the Selected Child index to the console when Table is clicked - * @param selectedChildIndex - */ -const handleTableClick = (selectedChildIndex: number) => { - console.log(selectedChildIndex); -}; +///** +// * Prints the Selected Child index to the console when Table is clicked +// * @param selectedChildIndex +// */ +//const handleTableClick = (selectedChildIndex: number) => { +// //console.log(selectedChildIndex); +//}; /** * Prints the Selected Child index to the console when Chair is clicked @@ -144,7 +144,7 @@ SevenTopSquareTable.args = { ], isSquare: true, tableUse: 'TableForManagement', - onTableClick: handleTableClick, + onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -257,7 +257,7 @@ EightTopVertRectangleTable.args = { ], isSquare: false, tableUse: 'TableForManagement', - onTableClick: handleTableClick, + onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -347,7 +347,7 @@ SixTopHorizontalRectangleTable.args = { isSquare: false, relativeSize: 0.5, tableUse: 'TableForManagement', - onTableClick: handleTableClick, + onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -410,7 +410,7 @@ SquareTableEditPage.args = { }, ], tableUse: 'TableForEditCanvas', - onTableClick: handleTableClick, + onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -472,6 +472,6 @@ BarRectangleTable.args = { ], isSquare: false, tableUse: 'TableForManagement', - onTableClick: handleTableClick, + onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; From 1fd6f04beb1e65acd704547a0cf19ca67073b147 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 20:19:48 -0800 Subject: [PATCH 5/9] Add relative sizes to TableContainer styles --- src/Containers/SquareTable/SquareTable.tsx | 49 +++++++++++++++------- 1 file changed, 33 insertions(+), 16 deletions(-) diff --git a/src/Containers/SquareTable/SquareTable.tsx b/src/Containers/SquareTable/SquareTable.tsx index 85fdcd0b4..c14f3a86a 100644 --- a/src/Containers/SquareTable/SquareTable.tsx +++ b/src/Containers/SquareTable/SquareTable.tsx @@ -2,7 +2,7 @@ * Documentation – the order of chairs are in the chairs array will populate the table from top left to the bottom right * “the purpose of the order in the array is to populate the chairs from top left to bottom right” */ -import React, { useEffect, useRef } from 'react'; +import React, {useEffect, useRef, useState} from 'react'; import styled, { useTheme } from 'styled-components'; import { Plus } from '@styled-icons/boxicons-regular'; import { IChair } from '../Chair/Chair'; @@ -77,11 +77,7 @@ export interface ISquareTable { /** * The current table index in array of tables. */ - TableIndex?: number; - /** - * Index number for the currently selected table - */ - selectedIndex: number; + tableIndex?: number; /** * Function to handle onClick event for the table * @param selectedChildIndex - the array index for the table @@ -103,8 +99,6 @@ export interface ISquareTable { isNotHighlightedWhenSelected?: boolean; } - - /** * Primary UI component for user interaction * Square Table @@ -119,8 +113,8 @@ export const SquareTable: React.FC = ({ relativeSize = 1.0, isSquare = false, tableUse = 'TableForManagement', - TableIndex = 0, - selectedIndex = -1, + tableIndex = 0, + //selectedIndex = -1, onTableClick, onChairClick, isNotHighlightedWhenSelected = false, @@ -129,18 +123,21 @@ export const SquareTable: React.FC = ({ // Create a reference to the TableBody styled component const tableBodyRef = useRef(document.createElement('div')); + const [selectedIndex, setSelectedIndex] = useState(-1); + /** * Use useEffect to keep focus on TableBody after re-render if the * selectedIndex number matches the arrayIndex number for this table */ useEffect(() => { - if (selectedIndex === TableIndex) { + if (selectedIndex === tableIndex) { if (tableBodyRef != null) { tableBodyRef.current.focus(); } } }); + /** * Split chairs array into four arrays for each table side */ @@ -166,8 +163,10 @@ export const SquareTable: React.FC = ({ * Calls the onTableClick prop function with the arrayIndex prop as its * parameter */ - const callOnTableClick: callOnTableClickType = () => - onTableClick(TableIndex); + const callOnTableClick: callOnTableClickType = () => { + onTableClick(tableIndex); + setSelectedIndex(tableIndex); + } /** * Determines how many chairs to put per each side @@ -232,7 +231,7 @@ export const SquareTable: React.FC = ({ relativeSize, tableUse, chairIndex: invisibileChairs.length, - tableIndex: TableIndex, + tableIndex: tableIndex, selectedIndex, onChairClick, }); @@ -299,7 +298,7 @@ export const SquareTable: React.FC = ({ {/** chairs top */} @@ -392,7 +391,25 @@ interface ITableContainer { } const TableContainer = styled.div` - + ${({ selectedIndex, tableIndex, relativeSize }):string => + { + const BASE_BORDER_RADIUS = 3; + const PADDING = 1.5; + + if(tableIndex === selectedIndex){ + return` + background-color: #EDEEF5; + border-radius: ${BASE_BORDER_RADIUS * relativeSize}rem; + width: fit-content; + padding: ${PADDING * relativeSize}rem; + border-style: dashed; + border-color: #DDDFE5; + `; + } + + return ``; + } + }; `; From 911b7b724b823fd11b1515bab7da3409328f0d85 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 21:17:35 -0800 Subject: [PATCH 6/9] Add colors to theme and use them for table outline. --- .../EditDraggableCanvas/_DraggableTable.tsx | 6 +++--- src/Containers/SquareTable/SquareTable.tsx | 16 ++++++---------- src/Themes/MainTheme.ts | 8 ++++++++ 3 files changed, 17 insertions(+), 13 deletions(-) diff --git a/src/Containers/EditDraggableCanvas/_DraggableTable.tsx b/src/Containers/EditDraggableCanvas/_DraggableTable.tsx index 157296cc1..3a81bcc15 100644 --- a/src/Containers/EditDraggableCanvas/_DraggableTable.tsx +++ b/src/Containers/EditDraggableCanvas/_DraggableTable.tsx @@ -153,7 +153,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - TableIndex={arrayIndex} + tableIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} @@ -171,7 +171,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - TableIndex={arrayIndex} + tableIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} @@ -189,7 +189,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - TableIndex={arrayIndex} + tableIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} diff --git a/src/Containers/SquareTable/SquareTable.tsx b/src/Containers/SquareTable/SquareTable.tsx index c14f3a86a..6840f79e1 100644 --- a/src/Containers/SquareTable/SquareTable.tsx +++ b/src/Containers/SquareTable/SquareTable.tsx @@ -104,7 +104,6 @@ export interface ISquareTable { * Square Table */ export const SquareTable: React.FC = ({ - // tableShape = 'Square', tableID = 'T1', partyName = 'Null', occupancyStatus = 'Vacant', @@ -114,7 +113,6 @@ export const SquareTable: React.FC = ({ isSquare = false, tableUse = 'TableForManagement', tableIndex = 0, - //selectedIndex = -1, onTableClick, onChairClick, isNotHighlightedWhenSelected = false, @@ -137,7 +135,6 @@ export const SquareTable: React.FC = ({ } }); - /** * Split chairs array into four arrays for each table side */ @@ -384,6 +381,9 @@ const getOccupancyColor: getOccupancyColorType = (occupancyStatus) => { } }; +/** + * Variables for the styled components + */ interface ITableContainer { relativeSize: number; tableIndex: number; @@ -391,19 +391,19 @@ interface ITableContainer { } const TableContainer = styled.div` - ${({ selectedIndex, tableIndex, relativeSize }):string => + ${({ selectedIndex, tableIndex, relativeSize, theme }):string => { const BASE_BORDER_RADIUS = 3; const PADDING = 1.5; if(tableIndex === selectedIndex){ return` - background-color: #EDEEF5; + background-color: ${theme.colors.tableOutline.background}; border-radius: ${BASE_BORDER_RADIUS * relativeSize}rem; width: fit-content; padding: ${PADDING * relativeSize}rem; border-style: dashed; - border-color: #DDDFE5; + border-color: ${theme.colors.tableOutline.border}; `; } @@ -413,10 +413,6 @@ const TableContainer = styled.div` `; -/** - * variables for the styled components - */ - interface ITableBody { chairNumOnSide: number; chairNumOnTop: number; diff --git a/src/Themes/MainTheme.ts b/src/Themes/MainTheme.ts index 05c6f13d1..fb99c7f61 100644 --- a/src/Themes/MainTheme.ts +++ b/src/Themes/MainTheme.ts @@ -37,6 +37,10 @@ export interface MainThemeInterface extends ThemeTemplateInterface { green: string; }; bannerBackgroundColor: string; + tableOutline: { + background: string; + border: string; + } }; } @@ -77,5 +81,9 @@ export const MainTheme: MainThemeInterface = { yellow: '#d1b306', green: '#09d106', }, + tableOutline: { + background: "#EDEEF5", + border: "#DDDFE5", + } }, }; From 5f0e82bcb25499098df8b21a21f3813af205b259 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 22:38:40 -0800 Subject: [PATCH 7/9] Remane tableIndex to arrayIndex to avoid warnings --- .../EditDraggableCanvas/_DraggableTable.tsx | 6 ++-- src/Containers/SquareTable/SquareTable.tsx | 31 ++++++++++--------- 2 files changed, 20 insertions(+), 17 deletions(-) diff --git a/src/Containers/EditDraggableCanvas/_DraggableTable.tsx b/src/Containers/EditDraggableCanvas/_DraggableTable.tsx index 3a81bcc15..0cf979476 100644 --- a/src/Containers/EditDraggableCanvas/_DraggableTable.tsx +++ b/src/Containers/EditDraggableCanvas/_DraggableTable.tsx @@ -153,7 +153,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - tableIndex={arrayIndex} + arrayIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} @@ -171,7 +171,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - tableIndex={arrayIndex} + arrayIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} @@ -189,7 +189,7 @@ export const DraggableTable: React.FC = ({ relativeSize={tableInput.relativeSize} chairs={tableInput.chairs} tableUse={tableInput.tableUse} - tableIndex={arrayIndex} + arrayIndex={arrayIndex} onTableClick={onTableClick} onChairClick={onChairClick} selectedIndex={selectedIndex} diff --git a/src/Containers/SquareTable/SquareTable.tsx b/src/Containers/SquareTable/SquareTable.tsx index 6840f79e1..7a902efaf 100644 --- a/src/Containers/SquareTable/SquareTable.tsx +++ b/src/Containers/SquareTable/SquareTable.tsx @@ -77,11 +77,14 @@ export interface ISquareTable { /** * The current table index in array of tables. */ - tableIndex?: number; + arrayIndex?: number; /** * Function to handle onClick event for the table * @param selectedChildIndex - the array index for the table */ + + selectedIndex?: number; + onTableClick: (selectedChildIndex: number) => void; /** * Function to handle onClick event for the chair @@ -112,7 +115,7 @@ export const SquareTable: React.FC = ({ relativeSize = 1.0, isSquare = false, tableUse = 'TableForManagement', - tableIndex = 0, + arrayIndex = 0, onTableClick, onChairClick, isNotHighlightedWhenSelected = false, @@ -121,14 +124,14 @@ export const SquareTable: React.FC = ({ // Create a reference to the TableBody styled component const tableBodyRef = useRef(document.createElement('div')); - const [selectedIndex, setSelectedIndex] = useState(-1); + const [selectedTable, setSelectedTable] = useState(-1); /** * Use useEffect to keep focus on TableBody after re-render if the * selectedIndex number matches the arrayIndex number for this table */ useEffect(() => { - if (selectedIndex === tableIndex) { + if (selectedTable === arrayIndex) { if (tableBodyRef != null) { tableBodyRef.current.focus(); } @@ -161,8 +164,8 @@ export const SquareTable: React.FC = ({ * parameter */ const callOnTableClick: callOnTableClickType = () => { - onTableClick(tableIndex); - setSelectedIndex(tableIndex); + onTableClick(arrayIndex); + setSelectedTable(arrayIndex); } /** @@ -228,8 +231,8 @@ export const SquareTable: React.FC = ({ relativeSize, tableUse, chairIndex: invisibileChairs.length, - tableIndex: tableIndex, - selectedIndex, + tableIndex: arrayIndex, + selectedIndex: selectedTable, onChairClick, }); } @@ -295,8 +298,8 @@ export const SquareTable: React.FC = ({ {/** chairs top */} = ({ chairs={topArray} relativeSize={relativeSize} tableUse={tableUse} - selectedIndex={selectedIndex} + selectedIndex={selectedTable} /> {/** table itself */} @@ -316,7 +319,7 @@ export const SquareTable: React.FC = ({ position="left" chairs={leftArray} tableUse={tableUse} - selectedIndex={selectedIndex} + selectedIndex={selectedTable} /> = ({ position="right" chairs={rightArray} tableUse={tableUse} - selectedIndex={selectedIndex} + selectedIndex={selectedTable} /> @@ -353,7 +356,7 @@ export const SquareTable: React.FC = ({ position="bottom" chairs={bottomArray} tableUse={tableUse} - selectedIndex={selectedIndex} + selectedIndex={selectedTable} /> From 54493b71a0c746ee64388c9d46ec6f37a1c2c395 Mon Sep 17 00:00:00 2001 From: Yurii Date: Thu, 27 Jan 2022 22:54:08 -0800 Subject: [PATCH 8/9] Return selectedIndex: number to ISquareTable interface to avoid warnings --- src/Containers/SquareTable/SquareTable.tsx | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/Containers/SquareTable/SquareTable.tsx b/src/Containers/SquareTable/SquareTable.tsx index 7a902efaf..d0a88f1a5 100644 --- a/src/Containers/SquareTable/SquareTable.tsx +++ b/src/Containers/SquareTable/SquareTable.tsx @@ -75,16 +75,17 @@ export interface ISquareTable { */ tableUse: tableUseTypes; /** - * The current table index in array of tables. + * Array index number for this table */ arrayIndex?: number; + /** + * Index number for the currently selected table + */ + selectedIndex: number; /** * Function to handle onClick event for the table * @param selectedChildIndex - the array index for the table */ - - selectedIndex?: number; - onTableClick: (selectedChildIndex: number) => void; /** * Function to handle onClick event for the chair From 87ae57d7de35e4a1183260c8ec752cb71160ce46 Mon Sep 17 00:00:00 2001 From: Yurii Date: Sat, 29 Jan 2022 12:49:44 -0800 Subject: [PATCH 9/9] Storybook action onTableClick moved to argTypes --- .../SquareTable/SquareTable.stories.tsx | 15 +-------------- 1 file changed, 1 insertion(+), 14 deletions(-) diff --git a/src/Containers/SquareTable/SquareTable.stories.tsx b/src/Containers/SquareTable/SquareTable.stories.tsx index 16986d612..cfb40127b 100644 --- a/src/Containers/SquareTable/SquareTable.stories.tsx +++ b/src/Containers/SquareTable/SquareTable.stories.tsx @@ -1,23 +1,15 @@ import React from 'react'; import { Meta, Story } from '@storybook/react'; import { ISquareTable, SquareTable } from '@Containers'; -import {action} from "@storybook/addon-actions"; export default { title: 'Components/TableManagement/SquareTable', component: SquareTable, + argTypes: { onTableClick: {action: "Clicked table with index: "} }, } as Meta; const Template: Story = (args) => ; -///** -// * Prints the Selected Child index to the console when Table is clicked -// * @param selectedChildIndex -// */ -//const handleTableClick = (selectedChildIndex: number) => { -// //console.log(selectedChildIndex); -//}; - /** * Prints the Selected Child index to the console when Chair is clicked * @param tableIndex @@ -144,7 +136,6 @@ SevenTopSquareTable.args = { ], isSquare: true, tableUse: 'TableForManagement', - onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -257,7 +248,6 @@ EightTopVertRectangleTable.args = { ], isSquare: false, tableUse: 'TableForManagement', - onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -347,7 +337,6 @@ SixTopHorizontalRectangleTable.args = { isSquare: false, relativeSize: 0.5, tableUse: 'TableForManagement', - onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -410,7 +399,6 @@ SquareTableEditPage.args = { }, ], tableUse: 'TableForEditCanvas', - onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, }; @@ -472,6 +460,5 @@ BarRectangleTable.args = { ], isSquare: false, tableUse: 'TableForManagement', - onTableClick: action("Clicked table with index: "), onChairClick: handleOnChairClick, };