Fixed issue with removing team members.

src/app/(main)/reports/ReportsTable.js

@@ -23,7 +23,7 @@ export function ReportsTable({ data = [], showDomain }) {
       </GridColumn>
       {showDomain && (
         <GridColumn name="domain" label={formatMessage(labels.domain)}>
-          {row => row.website.domain}
+          {row => row?.website?.domain}
         </GridColumn>
       )}
       <GridColumn name="action" label="" alignment="end">

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 size="lg">{icon}</Icon>
-        <InlineEditField
-          key={name}
-          name="name"
-          value={name}
-          placeholder={defaultName}
-          onCommit={handleNameChange}
-        />
-      </>
+      <div className={styles.header}>
+        <div className={styles.type}>
+          {formatMessage(
+            labels[Object.keys(REPORT_TYPES).find(key => REPORT_TYPES[key] === report?.type)],
+          )}
+        </div>
+        <div className={styles.title}>
+          <Icon size="lg">{icon}</Icon>
+          <InlineEditField
+            key={name}
+            name="name"
+            value={name}
+            placeholder={defaultName}
+            onCommit={handleNameChange}
+          />
+        </div>
+      </div>
     );
   };
 
+  if (!report) {
+    return <Loading />;
+  }
+
   return (
     <div className={reportStyles.header}>
       <PageHeader title={<Title />}>

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;
+}

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);
     }