From 1351e6f14af01ca1104140e9ae9763701a621c84 Mon Sep 17 00:00:00 2001 From: Mike Cao Date: Sun, 15 Oct 2023 02:08:29 -0700 Subject: [PATCH] Fixed issue with removing team members. --- src/app/(main)/reports/ReportsTable.js | 2 +- src/app/(main)/reports/[id]/ReportHeader.js | 34 +++++++++++++------ .../reports/[id]/ReportHeader.module.css | 17 ++++++++++ .../reports/retention/RetentionParameters.js | 1 + .../(main)/settings/teams/TeamLeaveForm.js | 2 ++ .../(main)/settings/teams/[id]/TeamMembers.js | 2 +- .../settings/teams/[id]/TeamMembersTable.js | 5 +-- .../settings/teams/[id]/TeamWebsiteAddForm.js | 2 +- src/components/input/WebsiteSelect.js | 2 +- src/components/layout/PageHeader.tsx | 2 +- 10 files changed, 51 insertions(+), 18 deletions(-) diff --git a/src/app/(main)/reports/ReportsTable.js b/src/app/(main)/reports/ReportsTable.js index fd41f393d..6b2a79320 100644 --- a/src/app/(main)/reports/ReportsTable.js +++ b/src/app/(main)/reports/ReportsTable.js @@ -23,7 +23,7 @@ export function ReportsTable({ data = [], showDomain }) { {showDomain && ( - {row => row.website.domain} + {row => row?.website?.domain} )} diff --git a/src/app/(main)/reports/[id]/ReportHeader.js b/src/app/(main)/reports/[id]/ReportHeader.js index a182142f9..dd92bc6da 100644 --- a/src/app/(main)/reports/[id]/ReportHeader.js +++ b/src/app/(main)/reports/[id]/ReportHeader.js @@ -1,11 +1,12 @@ import { useContext } from 'react'; import { useRouter } from 'next/navigation'; -import { Icon, LoadingButton, InlineEditField, useToasts } from 'react-basics'; +import { Icon, LoadingButton, InlineEditField, useToasts, Loading } from 'react-basics'; import PageHeader from 'components/layout/PageHeader'; import { useMessages, useApi } from 'components/hooks'; import { ReportContext } from './Report'; import styles from './ReportHeader.module.css'; import reportStyles from './Report.module.css'; +import { REPORT_TYPES } from 'lib/constants'; export function ReportHeader({ icon }) { const { report, updateReport } = useContext(ReportContext); @@ -49,19 +50,30 @@ export function ReportHeader({ icon }) { const Title = () => { return ( - <> - {icon} - - +
+
+ {formatMessage( + labels[Object.keys(REPORT_TYPES).find(key => REPORT_TYPES[key] === report?.type)], + )} +
+
+ {icon} + +
+
); }; + if (!report) { + return ; + } + return (
}> diff --git a/src/app/(main)/reports/[id]/ReportHeader.module.css b/src/app/(main)/reports/[id]/ReportHeader.module.css index 01e483a0d..c15e3795d 100644 --- a/src/app/(main)/reports/[id]/ReportHeader.module.css +++ b/src/app/(main)/reports/[id]/ReportHeader.module.css @@ -1,3 +1,20 @@ .description { color: var(--font-color300); } + +.header { + display: grid; +} + +.title { + display: flex; + flex-direction: row; + gap: 10px; +} + +.type { + font-size: 11px; + text-transform: uppercase; + color: var(--base600); + line-height: 30px; +} diff --git a/src/app/(main)/reports/retention/RetentionParameters.js b/src/app/(main)/reports/retention/RetentionParameters.js index 866376e0b..762a313df 100644 --- a/src/app/(main)/reports/retention/RetentionParameters.js +++ b/src/app/(main)/reports/retention/RetentionParameters.js @@ -19,6 +19,7 @@ export function RetentionParameters() { const handleSubmit = (data, e) => { e.stopPropagation(); e.preventDefault(); + if (!queryDisabled) { runReport(data); } diff --git a/src/app/(main)/settings/teams/TeamLeaveForm.js b/src/app/(main)/settings/teams/TeamLeaveForm.js index 8af2932db..a9b6922aa 100644 --- a/src/app/(main)/settings/teams/TeamLeaveForm.js +++ b/src/app/(main)/settings/teams/TeamLeaveForm.js @@ -1,6 +1,7 @@ import { Button, Form, FormButtons, SubmitButton } from 'react-basics'; import useApi from 'components/hooks/useApi'; import useMessages from 'components/hooks/useMessages'; +import { setValue } from 'store/cache'; export function TeamLeaveForm({ teamId, userId, teamName, onSave, onClose }) { const { formatMessage, labels, messages, FormattedMessage } = useMessages(); @@ -12,6 +13,7 @@ export function TeamLeaveForm({ teamId, userId, teamName, onSave, onClose }) { {}, { onSuccess: async () => { + setValue('team:members', Date.now()); onSave(); onClose(); }, diff --git a/src/app/(main)/settings/teams/[id]/TeamMembers.js b/src/app/(main)/settings/teams/[id]/TeamMembers.js index 55db98863..fb31b6fab 100644 --- a/src/app/(main)/settings/teams/[id]/TeamMembers.js +++ b/src/app/(main)/settings/teams/[id]/TeamMembers.js @@ -20,7 +20,7 @@ export function TeamMembers({ teamId, readOnly }) { return ( <> - {({ data }) => } + {({ data }) => } ); diff --git a/src/app/(main)/settings/teams/[id]/TeamMembersTable.js b/src/app/(main)/settings/teams/[id]/TeamMembersTable.js index 122ce9fa4..9a402d444 100644 --- a/src/app/(main)/settings/teams/[id]/TeamMembersTable.js +++ b/src/app/(main)/settings/teams/[id]/TeamMembersTable.js @@ -1,4 +1,4 @@ -import { GridColumn, GridTable } from 'react-basics'; +import { GridColumn, GridTable, useBreakpoint } from 'react-basics'; import useMessages from 'components/hooks/useMessages'; import useUser from 'components/hooks/useUser'; import { ROLES } from 'lib/constants'; @@ -7,6 +7,7 @@ import TeamMemberRemoveButton from './TeamMemberRemoveButton'; export function TeamMembersTable({ data = [], teamId, readOnly }) { const { formatMessage, labels } = useMessages(); const { user } = useUser(); + const breakpoint = useBreakpoint(); const roles = { [ROLES.teamOwner]: formatMessage(labels.teamOwner), @@ -14,7 +15,7 @@ export function TeamMembersTable({ data = [], teamId, readOnly }) { }; return ( - + {row => roles[row?.teamUser?.[0]?.role]} diff --git a/src/app/(main)/settings/teams/[id]/TeamWebsiteAddForm.js b/src/app/(main)/settings/teams/[id]/TeamWebsiteAddForm.js index 95f8490a5..9c2ae7bd3 100644 --- a/src/app/(main)/settings/teams/[id]/TeamWebsiteAddForm.js +++ b/src/app/(main)/settings/teams/[id]/TeamWebsiteAddForm.js @@ -33,7 +33,7 @@ export function TeamWebsiteAddForm({ teamId, onSave, onClose }) { return ( <> - {isLoading && !hasData && } + {isLoading && !hasData && } {!isLoading && !hasData && } {hasData && (
diff --git a/src/components/input/WebsiteSelect.js b/src/components/input/WebsiteSelect.js index 1bdc4608a..da8db09ef 100644 --- a/src/components/input/WebsiteSelect.js +++ b/src/components/input/WebsiteSelect.js @@ -5,7 +5,7 @@ import useMessages from 'components/hooks/useMessages'; export function WebsiteSelect({ websiteId, onSelect }) { const { formatMessage, labels } = useMessages(); const { get, useQuery } = useApi(); - const { data } = useQuery(['websites:me'], () => get('/me/websites')); + const { data } = useQuery(['websites:me'], () => get('/me/websites', { pageSize: 100 })); const renderValue = value => { return data?.data?.find(({ id }) => id === value)?.name; diff --git a/src/components/layout/PageHeader.tsx b/src/components/layout/PageHeader.tsx index c92a89a03..2261bebcb 100644 --- a/src/components/layout/PageHeader.tsx +++ b/src/components/layout/PageHeader.tsx @@ -3,7 +3,7 @@ import React, { ReactNode } from 'react'; import styles from './PageHeader.module.css'; export interface PageHeaderProps { - title?: string; + title?: ReactNode; className?: string; children?: ReactNode; }