init

worklenz-frontend/path/to/members-reports-drawer.tsx

@@ -0,0 +1,49 @@
+import MembersReportsTimeLogsTab from './members-reports-time-logs-tab';
+
+type MembersReportsDrawerProps = {
+  memberId: string | null;
+  exportTimeLogs: () => void;
+};
+
+const MembersReportsDrawer = ({ memberId, exportTimeLogs }: MembersReportsDrawerProps) => {
+  return (
+    <Drawer
+      open={isDrawerOpen}
+      onClose={handleClose}
+      width={900}
+      destroyOnClose
+      title={
+        selectedMember && (
+          <Flex align="center" justify="space-between">
+            <Flex gap={8} align="center" style={{ fontWeight: 500 }}>
+              <Typography.Text>{selectedMember.name}</Typography.Text>
+            </Flex>
+
+            <Space>
+              <TimeWiseFilter />
+              <Dropdown
+                menu={{
+                  items: [
+                    { key: '1', label: t('timeLogsButton'), onClick: exportTimeLogs },
+                    { key: '2', label: t('activityLogsButton') },
+                    { key: '3', label: t('tasksButton') },
+                  ],
+                }}
+              >
+                <Button type="primary" icon={<DownOutlined />} iconPosition="end">
+                  {t('exportButton')}
+                </Button>
+              </Dropdown>
+            </Space>
+          </Flex>
+        )
+      }
+    >
+      {selectedMember && <MembersReportsDrawerTabs memberId={selectedMember.id} />}
+      {selectedMember && <MembersOverviewTasksStatsDrawer memberId={selectedMember.id} />}
+      {selectedMember && <MembersOverviewProjectsStatsDrawer memberId={selectedMember.id} />}
+    </Drawer>
+  );
+};
+
+export default MembersReportsDrawer;