@homefile/components-v2 1.0.0

package/src/stories/homeAssistant/panel/HomeAssistantPanelStep.stories.tsx

@@ -0,0 +1,24 @@
+import { Meta } from '@storybook/react'
+import { HomeAssistantPanelStep } from '@/components'
+import { Box } from '@chakra-ui/react'
+
+export default {
+  title: 'Components/HomeAssistant',
+  component: HomeAssistantPanelStep,
+  args: {
+    currentStep: 3,
+  },
+  decorators: [
+    (Story: any) => (
+      <Box w="500px" p="base">
+        <Story />
+      </Box>
+    ),
+  ],
+} as Meta
+
+export const HomeAssistantPanelStepComponent = (args: {
+  currentStep: number
+}) => {
+  return <HomeAssistantPanelStep {...args} />
+}

package/src/stories/homeBoard/AddFolder.stories.tsx

@@ -0,0 +1,26 @@
+import { useEffect } from 'react'
+import { Meta } from '@storybook/react'
+import { Drawer, useDisclosure } from '@chakra-ui/react'
+import { AddFolder, FolderTypeSelection } from '@/components'
+import { action } from '@storybook/addon-actions'
+import { AddFolderI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: AddFolder,
+  args: {
+    children: <FolderTypeSelection onChange={action('onChange')} />,
+  },
+} as Meta<AddFolderI>
+
+export const AddFolderComponent = (args: AddFolderI) => {
+  const { isOpen, onOpen, onClose } = useDisclosure()
+  useEffect(() => {
+    onOpen()
+  }, [])
+  return (
+    <Drawer placement="right" onClose={onClose} isOpen={isOpen} size="md">
+      <AddFolder {...args} />
+    </Drawer>
+  )
+}

package/src/stories/homeBoard/AddHomeItem.stories.tsx

@@ -0,0 +1,17 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { AddHomeItem } from '@/components'
+import { AddHomeItemI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: AddHomeItem,
+} as Meta<AddHomeItemI>
+
+export const AddHomeItemComponent = (args: AddHomeItemI) => {
+  return (
+    <Box w={['full', '300px']}>
+      <AddHomeItem {...args} />
+    </Box>
+  )
+}

package/src/stories/homeBoard/AddPropertyRecords.stories.tsx

@@ -0,0 +1,28 @@
+import { Meta } from '@storybook/react'
+import { Drawer } from '@chakra-ui/react'
+import { AddPropertyRecords } from '@/components'
+import { formValues } from '@/helpers'
+import { AddPropertyRecordsI } from '@/interfaces'
+import { propertiesMock } from '@/mocks'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: AddPropertyRecords,
+  args: {
+    values: formValues,
+    properties: propertiesMock,
+  },
+  argTypes: {
+    step: {
+      options: ['initial', 'loading', 'properties'],
+    },
+  },
+} as Meta
+
+export const AddPropertyRecordsComponent = (args: AddPropertyRecordsI) => {
+  return (
+    <Drawer placement="left" onClose={() => null} isOpen size="md">
+      <AddPropertyRecords {...args} />
+    </Drawer>
+  )
+}

package/src/stories/homeBoard/DetailsTab.stories.tsx

@@ -0,0 +1,18 @@
+import { Meta,  } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { DetailsTab } from '@/components'
+import { DetailsTabI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: DetailsTab,
+} as Meta<DetailsTabI>
+
+export const DetailsTabComponent = (args: DetailsTabI) => {
+  return (
+    <Box width={['full', '500px']} p="base" bg="white">
+      <DetailsTab {...args} />
+    </Box>
+  )
+}
+

package/src/stories/homeBoard/EditAccountType.stories.tsx

@@ -0,0 +1,28 @@
+import { Meta } from '@storybook/react'
+import { Drawer } from '@chakra-ui/react'
+import { EditAccountType } from '@/components'
+import { EditAccountTypeI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: EditAccountType,
+} as Meta<EditAccountTypeI>
+
+export const EditAccountTypeComponent = (args: EditAccountTypeI) => {
+  return (
+    <Drawer placement="right" onClose={() => null} isOpen size="md">
+      <EditAccountType {...args} />
+    </Drawer>
+  )
+}
+
+EditAccountTypeComponent.args = {
+  associateAccount: {
+    accountTypes: ['member', 'manager'],
+    user: {
+      firstName: 'Adam',
+      lastName: 'Lee',
+      email: 'user@user.com',
+    },
+  },
+}

package/src/stories/homeBoard/File.stories.tsx

@@ -0,0 +1,29 @@
+import { Meta } from '@storybook/react'
+import { Wrap } from '@chakra-ui/react'
+import { File } from '@/components'
+import { FileI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: File,
+} as Meta<FileI>
+
+export const FileComponent = (args: FileI) => {
+  return (
+    <Wrap width="fit-content" p="4" bg="white">
+      <File {...args} />
+    </Wrap>
+  )
+}
+
+FileComponent.args = {
+  menu: [
+    {
+      handleClick: () => null,
+      label: 'edit',
+    },
+  ],
+  title: 'File title',
+  type: 'pdf',
+  updatedAt: '03-11-2022',
+}

package/src/stories/homeBoard/FileDetail.stories.tsx

@@ -0,0 +1,19 @@
+import { Meta } from '@storybook/react'
+import { Drawer } from '@chakra-ui/react'
+import { FileDetail } from '@/components'
+import { FileDetailI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: FileDetail,
+} as Meta<FileDetailI>
+
+export const FileDetailComponent = (args: FileDetailI) => {
+  return (
+    <Drawer placement="right" onClose={() => null} isOpen size="md">
+      <FileDetail {...args} />
+    </Drawer>
+  )
+}
+
+FileDetailComponent.args = {}

package/src/stories/homeBoard/Files.stories.tsx

@@ -0,0 +1,23 @@
+import { Meta,  } from '@storybook/react'
+import { Flex } from '@chakra-ui/react'
+import { Files } from '@/components'
+import { fileDB } from '@/helpers'
+import { FilesI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: Files,
+} as Meta<FilesI>
+
+export const FilesComponent = (args: FilesI) => {
+  return (
+    <Flex gap="base" p="base" bg="white">
+      <Files {...args} />
+    </Flex>
+  )
+}
+
+FilesComponent.args = {
+  panelSize: "md",
+  files: fileDB
+}

package/src/stories/homeBoard/FolderDetail.stories.tsx

@@ -0,0 +1,32 @@
+import { Meta } from '@storybook/react'
+import { Drawer } from '@chakra-ui/react'
+import { FolderDetail } from '@/components'
+import { fileDB, FoldersDB, recipientsDb } from '@/helpers'
+import { FolderDetailI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: FolderDetail,
+} as Meta<FolderDetailI>
+
+export const FolderDetailComponent = (args: FolderDetailI) => {
+  return (
+    <Drawer placement="right" onClose={() => null} isOpen size="md">
+      <FolderDetail {...args} panelSize="md" />
+    </Drawer>
+  )
+}
+
+FolderDetailComponent.args = {
+  recipients: recipientsDb,
+  addedBy: 'Adam Lee',
+  files: fileDB,
+  folder: FoldersDB[0],
+  handleUpload: () => null,
+  sortMenu: [
+    {
+      name: 'Name',
+      _id: 'name',
+    },
+  ],
+}

package/src/stories/homeBoard/HomeBoard.stories.tsx

@@ -0,0 +1,11 @@
+import { Meta } from '@storybook/react'
+import { HomeBoard } from '@/components'
+
+export default {
+  title: 'Pages/HomeBoard',
+  component: HomeBoard,
+} as Meta
+
+export const HomeBoardComponent = () => {
+  return <HomeBoard />
+}

package/src/stories/homeBoard/HomeCard.stories.tsx

@@ -0,0 +1,34 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { HomeCard } from '@/components'
+import { HomeCards } from '@/helpers'
+import { HomeCardI } from '@/interfaces'
+
+const { name, image, address } = HomeCards[0]
+
+export default {
+  title: 'Components/HomeBoard',
+  component: HomeCard,
+} as Meta<HomeCardI>
+
+export const HomeCardComponent = (args: HomeCardI) => {
+  return (
+    <Box maxW="24rem" minW="20rem">
+      <HomeCard {...args} />
+    </Box>
+  )
+}
+
+HomeCardComponent.args = {
+  apartmentNumber: address.apartmentNumber,
+  city: address.city,
+  name,
+  externalLink: 'https://www.google.com',
+  mail: 'user@user.com.br',
+  number: address.number,
+  obs: address.obs,
+  street: address.street,
+  state: address.state,
+  zip: address.zip,
+  imageUrl: image,
+}

package/src/stories/homeBoard/HomeCardWithRecipent.stories.tsx

@@ -0,0 +1,32 @@
+import { Meta } from '@storybook/react'
+import { HomeCardWithRecipent } from '@/components'
+import { HomeCards, recipientsDb } from '@/helpers'
+import { homeBoardRecorsMock } from '@/mocks'
+import { HomeCardWithRecipentI } from '@/interfaces'
+import { action } from '@storybook/addon-actions'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: HomeCardWithRecipent,
+} as Meta<HomeCardWithRecipentI>
+
+export const HomeCardWithRecipentComponent = (args: HomeCardWithRecipentI) => {
+  return <HomeCardWithRecipent {...args} />
+}
+
+const { address, _id, name } = HomeCards[0]
+
+HomeCardWithRecipentComponent.args = {
+  address,
+  externalLink: 'https://www.google.com',
+  _id,
+  name,
+  menu: [
+    {
+      label: 'Edit',
+      handleClick: action('Edit'),
+    },
+  ],
+  recipients: recipientsDb,
+  records: homeBoardRecorsMock,
+}

package/src/stories/homeBoard/HomeHeader.stories.tsx

@@ -0,0 +1,16 @@
+import { Meta } from '@storybook/react'
+import { HomeHeader } from '@/components'
+import { HomeHeaderI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: HomeHeader,
+} as Meta<HomeHeaderI>
+
+export const HomeHeaderComponent = (args: HomeHeaderI) => {
+  return <HomeHeader {...args} />
+}
+
+HomeHeaderComponent.args = {
+  homeName: 'The Edmunds',
+}

package/src/stories/homeBoard/SharedFilter.stories.tsx

@@ -0,0 +1,24 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { SharedFilter } from '@/components'
+import { SharedFilterI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: SharedFilter,
+} as Meta<SharedFilterI>
+
+export const SharedFilterComponent = (args: SharedFilterI) => {
+  return (
+    <Box width="30rem" p="base" bg="white">
+      <SharedFilter {...args} />
+    </Box>
+  )
+}
+
+SharedFilterComponent.args = {
+  showingFiles: 1,
+  totalFiles: 5,
+  uploading: false,
+  uploadingFiles: 5,
+}

package/src/stories/homeBoard/SortHeader.stories.tsx

@@ -0,0 +1,33 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { SortHeader } from '@/components'
+import { SortHeaderI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeBoard',
+  component: SortHeader,
+} as Meta<SortHeaderI>
+
+export const SortHeaderComponent = (args: SortHeaderI) => {
+  return (
+    <Box width="30rem" p="base" bg="white">
+      <SortHeader {...args} />
+    </Box>
+  )
+}
+
+SortHeaderComponent.args = {
+  selectItems: [
+    {
+      _id: '1',
+      name: 'Unshared',
+    },
+    {
+      _id: '2',
+      name: 'Shared',
+    },
+  ],
+  initialSelectTypeValue: 'pdf',
+  initialSelectValue: 'All',
+  selectTypeItems: ['pdf', 'svg', 'jpg', 'mp4'],
+}

package/src/stories/homeSummary/DocumentMenu.stories.tsx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { DocumentMenu } from '@/components'
+import { documents } from '@/helpers'
+import { DocumentListI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeSummary',
+  component: DocumentMenu,
+} as Meta<DocumentListI>
+
+export const DocumentMenuComponent = (args: DocumentListI) => {
+  return (
+    <Box w={['full', '300px']}>
+      <DocumentMenu {...args} />
+    </Box>
+  )
+}
+
+DocumentMenuComponent.args = {
+  documents: documents,
+  title: 'Create document',
+}

package/src/stories/homeSummary/ProjectList.stories.tsx

@@ -0,0 +1,23 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { ProjectList } from '@/components'
+import { ProjectListI } from '@/interfaces'
+import { action } from '@storybook/addon-actions'
+
+export default {
+  title: 'Components/HomeSummary',
+  component: ProjectList,
+} as Meta<ProjectListI>
+
+export const ProjectListComponent = (args: ProjectListI) => {
+  return (
+    <Box w={['full', '500px']}>
+      <ProjectList {...args} />
+    </Box>
+  )
+}
+
+ProjectListComponent.args = {
+  menuItems: [{ label: 'Edit', handleClick: action('Edit') }],
+  title: 'Project Name',
+}

package/src/stories/homeSummary/UpdateList.stories.tsx

@@ -0,0 +1,24 @@
+import { Meta,  } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { UpdateList } from '@/components'
+import { UpdateListI } from '@/interfaces'
+
+export default {
+  title: 'Components/HomeSummary',
+  component: UpdateList,
+} as Meta<UpdateListI>
+
+export const UpdateListComponent = (args: UpdateListI) => {
+  return (
+    <Box w={['full', '300px']}>
+      <UpdateList {...args} />
+    </Box>
+  )
+}
+
+UpdateListComponent.args = {
+  documentType: 'Progress Report',
+  isOpened: false,
+  projectName: 'The Edmunds',
+  updatedAt: '08.05',
+}

package/src/stories/householdItems/AddHomeItemHeader.stories.tsx

@@ -0,0 +1,31 @@
+import { Meta } from '@storybook/react'
+import { AddHomeItemHeader } from '@/components'
+import { ItemNameHeaderI, CreateHouseholdItemHeaderI } from '@/interfaces'
+import { action } from '@storybook/addon-actions'
+import { RoomsList, SelectGroups } from '@/helpers'
+import { Box } from '@chakra-ui/react'
+
+export default {
+  title: 'Components/HouseholdItems',
+  component: AddHomeItemHeader,
+  args: {
+    rooms: RoomsList,
+    initialRoom: RoomsList[0],
+    groups: SelectGroups,
+    initialGroup: SelectGroups[0].name,
+    value: 'Document name',
+  },
+  decorators: [
+    (Story) => (
+      <Box w={['full', '500px']}>
+        <Story />
+      </Box>
+    ),
+  ],
+} as Meta
+
+export const AddHomeItemHeaderComponent = (
+  args: ItemNameHeaderI & CreateHouseholdItemHeaderI
+) => {
+  return <AddHomeItemHeader {...args} />
+}

package/src/stories/householdItems/CreateItemHeader.stories.tsx

@@ -0,0 +1,29 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { CreateHouseholdItemHeader } from '@/components'
+import { SelectGroups, RoomsList } from '@/helpers'
+import { CreateHouseholdItemHeaderI } from '@/interfaces'
+
+export default {
+  title: 'Components/HouseholdItems',
+  component: CreateHouseholdItemHeader,
+} as Meta<CreateHouseholdItemHeaderI>
+
+export const CreateDocumentHeaderComponent = (
+  args: CreateHouseholdItemHeaderI
+) => {
+  return (
+    <Box w={['full', '500px']} bg="white" p="base">
+      <CreateHouseholdItemHeader {...args} />
+    </Box>
+  )
+}
+
+CreateDocumentHeaderComponent.args = {
+  rooms: RoomsList,
+  initialRoom: RoomsList[0],
+  handleSelectRoom: () => null,
+  groups: SelectGroups,
+  initialGroup: SelectGroups[0].name,
+  handleSelectGroup: () => null,
+}

package/src/stories/householdItems/ItemNameHeader.stories.tsx

@@ -0,0 +1,24 @@
+import { Meta } from '@storybook/react'
+import { Box } from '@chakra-ui/react'
+import { ItemNameHeader } from '@/components'
+import { ItemNameHeaderI } from '@/interfaces'
+
+export default {
+  title: 'Components/HouseholdItems',
+  component: ItemNameHeader,
+} as Meta<ItemNameHeaderI>
+
+export const DocumentNameHeaderWithoutValue = (args: ItemNameHeaderI) => {
+  return (
+    <Box w={['full', '300px']} bg="white" p="base">
+      <ItemNameHeader {...args} />
+    </Box>
+  )
+}
+
+export const DocumentNameHeaderWithValue = (args: ItemNameHeaderI) => (
+  <DocumentNameHeaderWithoutValue {...args} />
+)
+DocumentNameHeaderWithValue.args = {
+  value: 'Document name',
+}

package/src/stories/icons/ArrowLeft.stories.tsx

@@ -0,0 +1,16 @@
+import { Meta } from '@storybook/react'
+import { Center } from '@chakra-ui/react'
+import { ArrowLeft } from '@/components'
+
+export default {
+  title: 'Components/Icons',
+  component: ArrowLeft,
+} as Meta<typeof ArrowLeft>
+
+export const ArrowLeftComponent: typeof ArrowLeft = (args) => {
+  return (
+    <Center width="10rem" p="base" bg="white">
+      <ArrowLeft {...args} />
+    </Center>
+  )
+}

package/src/stories/icons/Calendar.stories.tsx

@@ -0,0 +1,16 @@
+import { Meta } from '@storybook/react'
+import { Center } from '@chakra-ui/react'
+import { Calendar } from '@/components'
+
+export default {
+  title: 'Components/Icons',
+  component: Calendar,
+} as Meta<typeof Calendar>
+
+export const CalendarComponent: typeof Calendar = (args) => {
+  return (
+    <Center width="10rem" p="base" bg="white">
+      <Calendar {...args} />
+    </Center>
+  )
+}

package/src/stories/icons/Camera.stories.tsx

@@ -0,0 +1,16 @@
+import { Meta } from '@storybook/react'
+import { Center } from '@chakra-ui/react'
+import { Camera } from '@/components'
+
+export default {
+  title: 'Components/Icons',
+  component: Camera,
+} as Meta<typeof Camera>
+
+export const CameraComponent: typeof Camera = (args) => {
+  return (
+    <Center width="10rem" p="base" bg="white">
+      <Camera {...args} />
+    </Center>
+  )
+}

package/src/stories/icons/ChevronDown.stories.tsx

@@ -0,0 +1,16 @@
+import { Meta } from '@storybook/react'
+import { Center } from '@chakra-ui/react'
+import { ChevronDown } from '@/components'
+
+export default {
+  title: 'Components/Icons',
+  component: ChevronDown,
+} as Meta<typeof ChevronDown>
+
+export const ChevronDownComponent: typeof ChevronDown = (args) => {
+  return (
+    <Center width="10rem" p="base" bg="white">
+      <ChevronDown {...args} />
+    </Center>
+  )
+}

package/src/stories/icons/ChevronLeft.stories.tsx

@@ -0,0 +1,16 @@
+import { Meta } from '@storybook/react'
+import { Center } from '@chakra-ui/react'
+import { ChevronLeft } from '@/components'
+
+export default {
+  title: 'Components/Icons',
+  component: ChevronLeft,
+} as Meta<typeof ChevronLeft>
+
+export const ChevronLeftComponent: typeof ChevronLeft = (args) => {
+  return (
+    <Center width="10rem" p="base" bg="white">
+      <ChevronLeft {...args} />
+    </Center>
+  )
+}