@homefile/components-v2 2.8.26 → 2.8.28
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/homeBoard/HomeBoard.js +1 -1
- package/dist/components/rooms/RoomCard.js +5 -4
- package/dist/components/rooms/RoomsBoard.js +1 -1
- package/dist/components/rooms/RoomsMenu.d.ts +1 -1
- package/dist/components/rooms/RoomsMenu.js +4 -4
- package/dist/components/rooms/RoomsMenuMobile.d.ts +1 -1
- package/dist/components/rooms/RoomsMenuMobile.js +4 -4
- package/dist/interfaces/rooms/RoomsMenu.interface.d.ts +3 -3
- package/package.json +1 -1
- package/src/components/homeBoard/HomeBoard.tsx +3 -3
- package/src/components/rooms/RoomCard.tsx +7 -6
- package/src/components/rooms/RoomsBoard.tsx +6 -6
- package/src/components/rooms/RoomsMenu.tsx +12 -17
- package/src/components/rooms/RoomsMenuMobile.tsx +12 -17
- package/src/interfaces/rooms/RoomsMenu.interface.ts +4 -4
|
@@ -52,7 +52,7 @@ export const HomeBoard = () => {
|
|
|
52
52
|
Notifications: (_jsx(NotificationsPanel, { notifications: notificationsMock, onClose: onRightClose, onDismiss: () => null })),
|
|
53
53
|
};
|
|
54
54
|
const panelSize = currentComponent === 'PartnerCatalog' ? 'lg' : 'md';
|
|
55
|
-
return (_jsxs(Box, { overflowX: "hidden", children: [_jsx(RightPanel, { overlay: showOverlay, isOpen: isRightOpen, onClose: onRightClose, size: panelSize, children: rightPanelComponents[currentComponent] }), _jsxs(Flex, { w: "full", minH: "100dvh", children: [_jsx(RoomsMenu, { activeRoom: "homeboard",
|
|
55
|
+
return (_jsxs(Box, { overflowX: "hidden", children: [_jsx(RightPanel, { overlay: showOverlay, isOpen: isRightOpen, onClose: onRightClose, size: panelSize, children: rightPanelComponents[currentComponent] }), _jsxs(Flex, { w: "full", minH: "100dvh", children: [_jsx(RoomsMenu, { activeRoom: "homeboard", onAddRoom: (id) => __awaiter(void 0, void 0, void 0, function* () { return console.log(id); }), onClick: () => null, onHomeClick: () => null, rooms: RoomsList, roomsToAdd: RoomsToAdd }), _jsxs(Box, { w: "full", children: [_jsx(AppBarComponent, { setActiveTour: setActiveTour, onClick: handleAppBarClick }), _jsxs(Stack, { spacing: "base", p: "base", children: [_jsx(HomeHeader, { buttonLabel: "Partner catalog", onBack: () => null, homeName: homeName, onAdd: () => null }), _jsxs(HomeBoardGrid, { children: [_jsx(HomeCardWithRecipent, { address: HomeCards[0].address, handleEdit: handleEditHomeClick, handleDeleteAccountType: (email) => email, handleSubmitAccountType: (form) => form, _id: HomeCards[0]._id, image: HomeCards[0].image, loading: false, name: HomeCards[0].name, menu: menuMock, addImage: () => null, recipients: recipientsDb, records: homeBoardRecorsMock }), _jsx(HomeAssistant, { currentPanel: homeAssistantCurrentStep, currentStep: 6, onStepClick: handleHomeAssistantClick }), _jsx(PropertyTaxes, { estimatedTaxValue: 1000, menuItems: menuMock, taxes: taxesMock, title: "Travis County Property Taxes" }), _jsx(HomeMonitor, { children: _jsxs(Stack, { spacing: "base", w: "full", px: "base", children: [_jsxs(Flex, { gap: "base", children: [_jsx(HomefileMonitoring, {}), _jsx(Notifications, { date: "10-10-24", local: "TX - Houston" })] }), _jsx(HomeMonitorSteps, { menuItems: [
|
|
56
56
|
{
|
|
57
57
|
label: 'Details',
|
|
58
58
|
handleClick: handleHomeAssistantClick,
|
|
@@ -13,10 +13,11 @@ export const RoomCard = ({ activeRoom = '', draggable = true, handleClick, handl
|
|
|
13
13
|
index,
|
|
14
14
|
room,
|
|
15
15
|
});
|
|
16
|
-
const { type
|
|
17
|
-
const
|
|
18
|
-
|
|
16
|
+
const { type, name: label, _id: id } = room;
|
|
17
|
+
const isActive = activeRoom === id;
|
|
18
|
+
const alt = getIconAltText(type);
|
|
19
|
+
return (_jsx(Tooltip, { hasArrow: true, isDisabled: isOpen || isActive, label: capitalize(label), placement: "right", children: _jsx(Box, { draggable: draggable, overflow: "hidden", onDragStart: handleRoomDragStart, onDragEnd: onDragEnd, onDragEnter: onDragOverOrEnter, onDragLeave: onDragLeave, onDragOver: onDragOverOrEnter, onDrop: handleRoomDrop, onClick: handleRoomClick, children: _jsx(Box, { w: "full", as: "button", h: "3.2rem", bg: isActive ? 'lightGreen.3' : styles.bg, marginTop: styles.mTop, transition: "all 0.1s ease-in-out", _hover: { backgroundColor: 'lightGreen.3' }, _disabled: {
|
|
19
20
|
filter: 'grayscale(100%)',
|
|
20
21
|
pointerEvents: 'none',
|
|
21
|
-
}, children: _jsxs(Flex, { justify: "start", alignItems: "center", opacity: styles.opacity, children: [_jsx(Center, { minW: "container.roomIcon", children:
|
|
22
|
+
}, children: _jsxs(Flex, { justify: "start", alignItems: "center", opacity: styles.opacity, children: [_jsx(Center, { minW: "container.roomIcon", children: type && (_jsx(Image, { src: roomIcons[type], alt: alt, w: "1.5rem", h: "auto" })) }), _jsx(Box, { flex: "1", children: _jsx(Text, { textAlign: "left", variant: "caption", noOfLines: 1, overflow: "hidden", children: label }) }), _jsx(Center, { w: "container.roomIcon", cursor: draggable ? 'move' : '', children: draggable ? _jsx(Menu, {}) : _jsx(Plus, { stroke: colors.blue[3] }) })] }) }) }) }));
|
|
22
23
|
};
|
|
@@ -18,5 +18,5 @@ export const RoomsBoard = () => {
|
|
|
18
18
|
const handleStep = (step) => {
|
|
19
19
|
setCurrentStep(step);
|
|
20
20
|
};
|
|
21
|
-
return (_jsxs(Box, { w: "full", position: "relative", children: [_jsx(RoomsMenuMobile, { activeRoom: currentRoom._id,
|
|
21
|
+
return (_jsxs(Box, { w: "full", position: "relative", children: [_jsx(RoomsMenuMobile, { activeRoom: currentRoom._id, onAddRoom: () => Promise.resolve(), onClick: handleClick, onHomeClick: () => null, rooms: RoomsList, roomsToAdd: RoomsToAdd }), _jsxs(Flex, { children: [_jsx(RoomsMenu, { activeRoom: currentRoom._id, onAddRoom: () => Promise.resolve(), onClick: handleClick, onHomeClick: () => null, rooms: RoomsList, roomsToAdd: RoomsToAdd }), _jsxs(Box, { w: "full", minH: "100dvh", children: [_jsx(AppBarComponent, { setActiveTour: setActiveTour }), _jsx(RoomHeader, { isDeleteDisabled: false, onClickDelete: (_) => null, onSubmit: (_) => null, room: currentRoom, roomAmount: "1322.25" }), _jsxs(GroupsContainer, { children: [_jsx(GroupsHeader, { groupList: Groups, onClick: () => Promise.resolve(), showingTour: currentStep === 'creatingGroups' }), _jsx(SimpleGrid, { minChildWidth: ['full', '27rem'], spacing: "base", textAlign: "left", children: _jsx(GroupCard, { items: PaintItems, title: "Paints & Stains", totalAmount: 17000, _id: "1", onAddItem: () => null, onAddImage: () => null, onClickDelete: () => null, onClickDetails: () => null, firstFilterItems: ['All', 'Paint', 'Stain'], onFirstFilterClick: () => null, onSave: () => null, secondFilterItems: ['All', 'Paint', 'Stain'], onMove: () => null }) })] })] })] }), _jsx(RoomsBoardTour, { currentStep: currentStep, handleClose: handleClose, handleStep: handleStep, meetStepUrl: videoMock, isActive: activeTour })] }));
|
|
22
22
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { RoomsMenuI } from '../../interfaces';
|
|
2
|
-
export declare const RoomsMenu: ({ activeRoom, rooms, roomsToAdd,
|
|
2
|
+
export declare const RoomsMenu: ({ activeRoom, rooms, roomsToAdd, onClick, onHomeClick, onAddRoom, disabled, }: RoomsMenuI) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -4,13 +4,13 @@ import { Box, Center, Tooltip, Image, useDisclosure, Show, } from '@chakra-ui/re
|
|
|
4
4
|
import { RoomCard, NewRoomPanel, LeftPanel, Plus } from '..';
|
|
5
5
|
import { useRoomList } from '../../hooks';
|
|
6
6
|
import { House } from '../../assets/images';
|
|
7
|
-
export const RoomsMenu = ({ activeRoom, rooms, roomsToAdd,
|
|
7
|
+
export const RoomsMenu = ({ activeRoom, rooms, roomsToAdd, onClick, onHomeClick, onAddRoom, disabled, }) => {
|
|
8
8
|
const { handleDragStart, handleDrop, newRooms } = useRoomList(rooms);
|
|
9
9
|
const { isOpen, onOpen, onClose } = useDisclosure();
|
|
10
10
|
return (_jsx(Show, { breakpoint: "(min-width: 600px)", children: _jsxs(Box, { bg: "neutral.white", minW: "fit-content", children: [_jsxs(Box, { w: "container.roomIcon", minW: "container.roomIcon", transition: "all 0.2s ease-in-out", bg: "lightBlue.4", children: [_jsx(Box, { overflow: "hidden", children: _jsx(Tooltip, { hasArrow: true, isDisabled: false, label: t('addRoom.addBtn'), placement: "right", children: _jsx(Box, { as: "button", w: "full", h: "container.masthead", onClick: onOpen, transition: "all 0.2s ease-in-out", bg: "blue.2", disabled: disabled, overflow: "hidden", _hover: { backgroundColor: 'blue.3' }, _disabled: {
|
|
11
11
|
filter: 'grayscale(100%)',
|
|
12
12
|
pointerEvents: 'none',
|
|
13
|
-
}, children: _jsx(Center, { minW: "container.roomIcon", children: _jsx(Plus, {}) }) }) }) }), _jsx(Tooltip, { hasArrow: true, isDisabled: activeRoom === 'homeboard', label: t('rooms.homeboard'), placement: "right", children: _jsx(Box, { w: "full", as: "button", h: "3.2rem", bg: activeRoom === 'homeboard' ? 'lightGreen.3' : 'neutral.white', onClick:
|
|
14
|
-
return (_jsxs(Box, { children: [_jsx(Box, { bg: "neutral.white", children: _jsx(Box, { h: "1px", bg: "lightBlue.4" }) }), _jsx(RoomCard, { activeRoom: activeRoom, handleClick:
|
|
15
|
-
}) })] }), _jsx(LeftPanel, { size: "xs", children: _jsx(NewRoomPanel, { rooms: roomsToAdd, handleClick:
|
|
13
|
+
}, children: _jsx(Center, { minW: "container.roomIcon", children: _jsx(Plus, {}) }) }) }) }), _jsx(Tooltip, { hasArrow: true, isDisabled: activeRoom === 'homeboard', label: t('rooms.homeboard'), placement: "right", children: _jsx(Box, { w: "full", as: "button", h: "3.2rem", bg: activeRoom === 'homeboard' ? 'lightGreen.3' : 'neutral.white', onClick: onHomeClick, children: _jsx(Center, { minW: "container.roomIcon", children: _jsx(Image, { src: House, alt: t('ariaLabels.returnHomeBoard'), w: "1.5rem", h: "auto" }) }) }) }), _jsx(Box, { children: newRooms.map((room, i) => {
|
|
14
|
+
return (_jsxs(Box, { children: [_jsx(Box, { bg: "neutral.white", children: _jsx(Box, { h: "1px", bg: "lightBlue.4" }) }), _jsx(RoomCard, { activeRoom: activeRoom, handleClick: onClick, handleDragStart: handleDragStart, handleDrop: handleDrop, index: i, room: room }), i === newRooms.length - 1 && (_jsx(Box, { bg: "neutral.white", children: _jsx(Box, { h: "1px", bg: "lightBlue.4" }) }))] }, room._id));
|
|
15
|
+
}) })] }), _jsx(LeftPanel, { size: "xs", isOpen: isOpen, onClose: onClose, children: _jsx(NewRoomPanel, { rooms: roomsToAdd, handleClick: onAddRoom, handleClose: onClose }) })] }) }));
|
|
16
16
|
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { RoomsMenuI } from '../../interfaces';
|
|
2
|
-
export declare const RoomsMenuMobile: ({ activeRoom, rooms, roomsToAdd,
|
|
2
|
+
export declare const RoomsMenuMobile: ({ activeRoom, rooms, roomsToAdd, onClick, onHomeClick, onAddRoom, }: RoomsMenuI) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -5,7 +5,7 @@ import { NewRoomPanel, LeftPanel, Plus } from '..';
|
|
|
5
5
|
import { useRoomList } from '../../hooks';
|
|
6
6
|
import { roomIcons } from '../../helpers';
|
|
7
7
|
import { House } from '../../assets/images';
|
|
8
|
-
export const RoomsMenuMobile = ({ activeRoom, rooms, roomsToAdd,
|
|
8
|
+
export const RoomsMenuMobile = ({ activeRoom, rooms, roomsToAdd, onClick, onHomeClick, onAddRoom, }) => {
|
|
9
9
|
const { newRooms } = useRoomList(rooms);
|
|
10
10
|
const { isOpen, onOpen, onClose } = useDisclosure();
|
|
11
11
|
return (_jsx(Show, { breakpoint: "(max-width: 590px)", children: _jsxs(Box, { mt: "2", w: "full", position: "fixed", bottom: "0", shadow: "0 0 8px 1px #00000010", zIndex: "dropdown", overflow: "hidden", overflowX: "auto", css: {
|
|
@@ -15,7 +15,7 @@ export const RoomsMenuMobile = ({ activeRoom, rooms, roomsToAdd, handleClick, ha
|
|
|
15
15
|
}, children: [_jsxs(Flex, { children: [_jsx(Box, { py: "4", as: "button", onClick: onOpen, transition: "all 0.2s ease-in-out", bg: "blue.2", _hover: { backgroundColor: 'blue.3' }, _disabled: {
|
|
16
16
|
filter: 'grayscale(100%)',
|
|
17
17
|
pointerEvents: 'none',
|
|
18
|
-
}, children: _jsx(Center, { w: "container.roomIcon", children: _jsx(Plus, {}) }) }), _jsx(Box, { as: "button", bg: "neutral.white", onClick:
|
|
19
|
-
return (_jsx(Box, { as: "button", bg: activeRoom === room.name ? 'lightGreen.3' : 'neutral.white', onClick: () =>
|
|
20
|
-
})] }), _jsx(LeftPanel, { size: "xs", children: _jsx(NewRoomPanel, { rooms: roomsToAdd, handleClick:
|
|
18
|
+
}, children: _jsx(Center, { w: "container.roomIcon", children: _jsx(Plus, {}) }) }), _jsx(Box, { as: "button", bg: "neutral.white", onClick: onHomeClick, children: _jsx(Center, { w: "container.roomIcon", children: _jsx(Image, { src: House, alt: t('ariaLabels.returnHomeBoard'), w: "1.5rem", h: "auto" }) }) }), newRooms.map((room) => {
|
|
19
|
+
return (_jsx(Box, { as: "button", bg: activeRoom === room.name ? 'lightGreen.3' : 'neutral.white', onClick: () => onClick(room), borderLeft: "1px", borderColor: "lightBlue.4", transition: "all 0.1s ease-in-out", _hover: { backgroundColor: 'lightGreen.3' }, children: _jsx(Center, { w: "container.roomIcon", children: _jsx(Image, { src: roomIcons[room.type], alt: room.name, w: "1.5rem", h: "auto" }) }) }, room._id));
|
|
20
|
+
})] }), _jsx(LeftPanel, { size: "xs", isOpen: isOpen, onClose: onClose, children: _jsx(NewRoomPanel, { rooms: roomsToAdd, handleClick: onAddRoom, handleClose: onClose }) })] }) }));
|
|
21
21
|
};
|
|
@@ -35,8 +35,8 @@ export interface RoomsMenuI {
|
|
|
35
35
|
activeRoom: string;
|
|
36
36
|
rooms: RoomItemI[];
|
|
37
37
|
roomsToAdd: AddRoomI[];
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
38
|
+
onAddRoom: (id: string) => Promise<void>;
|
|
39
|
+
onClick: (room: RoomItemI) => void;
|
|
40
|
+
onHomeClick: () => void;
|
|
41
41
|
disabled?: boolean;
|
|
42
42
|
}
|
package/package.json
CHANGED
|
@@ -306,9 +306,9 @@ export const HomeBoard = () => {
|
|
|
306
306
|
<Flex w="full" minH="100dvh">
|
|
307
307
|
<RoomsMenu
|
|
308
308
|
activeRoom="homeboard"
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
309
|
+
onAddRoom={async (id) => console.log(id)}
|
|
310
|
+
onClick={() => null}
|
|
311
|
+
onHomeClick={() => null}
|
|
312
312
|
rooms={RoomsList}
|
|
313
313
|
roomsToAdd={RoomsToAdd}
|
|
314
314
|
/>
|
|
@@ -32,13 +32,14 @@ export const RoomCard = ({
|
|
|
32
32
|
room,
|
|
33
33
|
})
|
|
34
34
|
|
|
35
|
-
const { type
|
|
36
|
-
const
|
|
35
|
+
const { type, name: label, _id: id } = room as RoomItemI
|
|
36
|
+
const isActive = activeRoom === id
|
|
37
|
+
const alt = getIconAltText(type)
|
|
37
38
|
|
|
38
39
|
return (
|
|
39
40
|
<Tooltip
|
|
40
41
|
hasArrow
|
|
41
|
-
isDisabled={isOpen ||
|
|
42
|
+
isDisabled={isOpen || isActive}
|
|
42
43
|
label={capitalize(label)}
|
|
43
44
|
placement="right"
|
|
44
45
|
>
|
|
@@ -57,7 +58,7 @@ export const RoomCard = ({
|
|
|
57
58
|
w="full"
|
|
58
59
|
as="button"
|
|
59
60
|
h="3.2rem"
|
|
60
|
-
bg={
|
|
61
|
+
bg={isActive ? 'lightGreen.3' : styles.bg}
|
|
61
62
|
marginTop={styles.mTop}
|
|
62
63
|
transition="all 0.1s ease-in-out"
|
|
63
64
|
_hover={{ backgroundColor: 'lightGreen.3' }}
|
|
@@ -68,8 +69,8 @@ export const RoomCard = ({
|
|
|
68
69
|
>
|
|
69
70
|
<Flex justify="start" alignItems="center" opacity={styles.opacity}>
|
|
70
71
|
<Center minW="container.roomIcon">
|
|
71
|
-
{
|
|
72
|
-
<Image src={roomIcons[
|
|
72
|
+
{type && (
|
|
73
|
+
<Image src={roomIcons[type]} alt={alt} w="1.5rem" h="auto" />
|
|
73
74
|
)}
|
|
74
75
|
</Center>
|
|
75
76
|
<Box flex="1">
|
|
@@ -36,9 +36,9 @@ export const RoomsBoard = () => {
|
|
|
36
36
|
<Box w="full" position="relative">
|
|
37
37
|
<RoomsMenuMobile
|
|
38
38
|
activeRoom={currentRoom._id}
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
39
|
+
onAddRoom={() => Promise.resolve()}
|
|
40
|
+
onClick={handleClick}
|
|
41
|
+
onHomeClick={() => null}
|
|
42
42
|
rooms={RoomsList}
|
|
43
43
|
roomsToAdd={RoomsToAdd}
|
|
44
44
|
/>
|
|
@@ -46,9 +46,9 @@ export const RoomsBoard = () => {
|
|
|
46
46
|
<Flex>
|
|
47
47
|
<RoomsMenu
|
|
48
48
|
activeRoom={currentRoom._id}
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
49
|
+
onAddRoom={() => Promise.resolve()}
|
|
50
|
+
onClick={handleClick}
|
|
51
|
+
onHomeClick={() => null}
|
|
52
52
|
rooms={RoomsList}
|
|
53
53
|
roomsToAdd={RoomsToAdd}
|
|
54
54
|
/>
|
|
@@ -16,9 +16,9 @@ export const RoomsMenu = ({
|
|
|
16
16
|
activeRoom,
|
|
17
17
|
rooms,
|
|
18
18
|
roomsToAdd,
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
19
|
+
onClick,
|
|
20
|
+
onHomeClick,
|
|
21
|
+
onAddRoom,
|
|
22
22
|
disabled,
|
|
23
23
|
}: RoomsMenuI) => {
|
|
24
24
|
const { handleDragStart, handleDrop, newRooms } = useRoomList(rooms)
|
|
@@ -72,7 +72,7 @@ export const RoomsMenu = ({
|
|
|
72
72
|
as="button"
|
|
73
73
|
h="3.2rem"
|
|
74
74
|
bg={activeRoom === 'homeboard' ? 'lightGreen.3' : 'neutral.white'}
|
|
75
|
-
onClick={
|
|
75
|
+
onClick={onHomeClick}
|
|
76
76
|
>
|
|
77
77
|
<Center minW="container.roomIcon">
|
|
78
78
|
<Image
|
|
@@ -93,7 +93,7 @@ export const RoomsMenu = ({
|
|
|
93
93
|
</Box>
|
|
94
94
|
<RoomCard
|
|
95
95
|
activeRoom={activeRoom}
|
|
96
|
-
handleClick={
|
|
96
|
+
handleClick={onClick}
|
|
97
97
|
handleDragStart={handleDragStart}
|
|
98
98
|
handleDrop={handleDrop}
|
|
99
99
|
index={i}
|
|
@@ -109,18 +109,13 @@ export const RoomsMenu = ({
|
|
|
109
109
|
})}
|
|
110
110
|
</Box>
|
|
111
111
|
</Box>
|
|
112
|
-
<LeftPanel
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
/>
|
|
120
|
-
}
|
|
121
|
-
isOpen={isOpen}
|
|
122
|
-
onClose={onClose}
|
|
123
|
-
/>
|
|
112
|
+
<LeftPanel size="xs" isOpen={isOpen} onClose={onClose}>
|
|
113
|
+
<NewRoomPanel
|
|
114
|
+
rooms={roomsToAdd}
|
|
115
|
+
handleClick={onAddRoom}
|
|
116
|
+
handleClose={onClose}
|
|
117
|
+
/>
|
|
118
|
+
</LeftPanel>
|
|
124
119
|
</Box>
|
|
125
120
|
</Show>
|
|
126
121
|
)
|
|
@@ -10,9 +10,9 @@ export const RoomsMenuMobile = ({
|
|
|
10
10
|
activeRoom,
|
|
11
11
|
rooms,
|
|
12
12
|
roomsToAdd,
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
13
|
+
onClick,
|
|
14
|
+
onHomeClick,
|
|
15
|
+
onAddRoom,
|
|
16
16
|
}: RoomsMenuI) => {
|
|
17
17
|
const { newRooms } = useRoomList(rooms)
|
|
18
18
|
const { isOpen, onOpen, onClose } = useDisclosure()
|
|
@@ -51,7 +51,7 @@ export const RoomsMenuMobile = ({
|
|
|
51
51
|
<Plus />
|
|
52
52
|
</Center>
|
|
53
53
|
</Box>
|
|
54
|
-
<Box as="button" bg="neutral.white" onClick={
|
|
54
|
+
<Box as="button" bg="neutral.white" onClick={onHomeClick}>
|
|
55
55
|
<Center w="container.roomIcon">
|
|
56
56
|
<Image
|
|
57
57
|
src={House}
|
|
@@ -68,7 +68,7 @@ export const RoomsMenuMobile = ({
|
|
|
68
68
|
key={room._id}
|
|
69
69
|
as="button"
|
|
70
70
|
bg={activeRoom === room.name ? 'lightGreen.3' : 'neutral.white'}
|
|
71
|
-
onClick={() =>
|
|
71
|
+
onClick={() => onClick(room)}
|
|
72
72
|
borderLeft="1px"
|
|
73
73
|
borderColor="lightBlue.4"
|
|
74
74
|
transition="all 0.1s ease-in-out"
|
|
@@ -86,18 +86,13 @@ export const RoomsMenuMobile = ({
|
|
|
86
86
|
)
|
|
87
87
|
})}
|
|
88
88
|
</Flex>
|
|
89
|
-
<LeftPanel
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
/>
|
|
97
|
-
}
|
|
98
|
-
isOpen={isOpen}
|
|
99
|
-
onClose={onClose}
|
|
100
|
-
/>
|
|
89
|
+
<LeftPanel size="xs" isOpen={isOpen} onClose={onClose}>
|
|
90
|
+
<NewRoomPanel
|
|
91
|
+
rooms={roomsToAdd}
|
|
92
|
+
handleClick={onAddRoom}
|
|
93
|
+
handleClose={onClose}
|
|
94
|
+
/>
|
|
95
|
+
</LeftPanel>
|
|
101
96
|
</Box>
|
|
102
97
|
</Show>
|
|
103
98
|
)
|
|
@@ -39,8 +39,8 @@ export interface RoomsMenuI {
|
|
|
39
39
|
activeRoom: string
|
|
40
40
|
rooms: RoomItemI[]
|
|
41
41
|
roomsToAdd: AddRoomI[]
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
42
|
+
onAddRoom: (id: string) => Promise<void>
|
|
43
|
+
onClick: (room: RoomItemI) => void
|
|
44
|
+
onHomeClick: () => void
|
|
45
45
|
disabled?: boolean
|
|
46
|
-
}
|
|
46
|
+
}
|