-
-
-
-
-
-
-
-
-
- {title}
- {isLatest && (
-
- Latest Incident Report
-
- )}
-
-
-
-
- {source_domain}
-
-
-
-
+
+
+
+
+ );
+};
+
+const Card = (props) => {
+ const className = `
+ flex flex-col lg:flex-row items-center
+ bg-white rounded-lg border shadow-md dark:border-gray-700 dark:bg-gray-800 h-full
+ `;
+
+ return
{props.children}
;
+};
+
+const CardImage = ({ reportLink, cloudinary_id, image_url, title, t, incident_id }) => {
+ return (
+
+
+
+
);
};
+const CardBody = ({
+ report,
+ incident,
+ isLatest,
+ reportLink,
+ epoch_date_submitted,
+ url,
+ source_domain,
+ text,
+}) => {
+ return (
+
+
+
+ Incident {incident.incident_id}: {incident.title}
+
+
+
+
+ );
+};
+
+const ReportPreview = ({
+ reportLink,
+ report,
+ isLatest,
+ source_domain,
+ url,
+ epoch_date_submitted,
+ text,
+}) => (
+
+
+
+ “{report.title}”{isLatest && }
+
+
+
+
+ {source_domain}
+
+
+
+
+
+
+
+
+
+
+);
+
+const ReadMoreButton = ({ reportLink, className }) => (
+
+ Read More
+
+
+);
+
+const LatestIncidentBadge = () => (
+
+ Latest Incident Report
+
+);
+
export default LatestIncidentReport;
diff --git a/site/gatsby-site/src/components/landing/LatestReports.js b/site/gatsby-site/src/components/landing/LatestReports.js
index a1f7ab16ae..f78a2c4bcf 100644
--- a/site/gatsby-site/src/components/landing/LatestReports.js
+++ b/site/gatsby-site/src/components/landing/LatestReports.js
@@ -4,7 +4,7 @@ import { Carousel } from 'flowbite-react';
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
import { faArrowCircleLeft, faArrowCircleRight } from '@fortawesome/free-solid-svg-icons';
-export default function LatestReports({ latestReports }) {
+export default function LatestReports({ latestIncidents }) {
return (
<>
}
>
- {latestReports.map((report, index) => (
+ {latestIncidents.map((incident, index) => (
))}
diff --git a/site/gatsby-site/src/components/reports/ReportsTable.js b/site/gatsby-site/src/components/reports/ReportsTable.js
new file mode 100644
index 0000000000..b460ffd8c7
--- /dev/null
+++ b/site/gatsby-site/src/components/reports/ReportsTable.js
@@ -0,0 +1,183 @@
+import { useUserContext } from 'contexts/userContext';
+import React from 'react';
+import { useFilters, usePagination, useSortBy, useTable } from 'react-table';
+import { Trans, useTranslation } from 'react-i18next';
+import { Button, ToggleSwitch } from 'flowbite-react';
+import Table, {
+ DefaultColumnFilter,
+ DefaultColumnHeader,
+ SelectColumnFilter,
+ SelectDatePickerFilter,
+ filterDate,
+ formatDateField,
+ sortDateField,
+} from 'components/ui/Table';
+
+export default function ReportsTable({ data, isLiveData, setIsLiveData }) {
+ const { isLoggedIn, isRole } = useUserContext();
+
+ const { t } = useTranslation();
+
+ const defaultColumn = React.useMemo(
+ () => ({
+ className: 'min-w-[120px]',
+ Filter: DefaultColumnFilter,
+ Header: DefaultColumnHeader,
+ }),
+ []
+ );
+
+ const columns = React.useMemo(() => {
+ const columns = [
+ {
+ title: t('Report Number'),
+ accessor: 'report_number',
+ Cell: ({ row: { values } }) => (
+
+ Report {values.report_number}
+
+ ),
+ },
+ {
+ className: 'min-w-[340px]',
+ title: t('Title'),
+ accessor: 'title',
+ },
+ {
+ title: t('Date Submitted'),
+ accessor: 'date_submitted',
+ Cell: ({ value }) => formatDateField(value),
+ Filter: SelectDatePickerFilter,
+ sortType: (rowA, rowB) => {
+ return sortDateField(rowA, rowB, 'date_submitted');
+ },
+ filter: (rows, id, filterValue) => filterDate(rows, id, filterValue),
+ },
+ {
+ title: t('Date Published'),
+ accessor: 'date_published',
+ Cell: ({ value }) => formatDateField(value),
+ Filter: SelectDatePickerFilter,
+ sortType: (rowA, rowB) => {
+ return sortDateField(rowA, rowB, 'date_published');
+ },
+ filter: (rows, id, filterValue) => filterDate(rows, id, filterValue),
+ },
+ {
+ title: t('Date Modified'),
+ accessor: 'date_modified',
+ Cell: ({ value }) => formatDateField(value),
+ Filter: SelectDatePickerFilter,
+ sortType: (rowA, rowB) => {
+ return sortDateField(rowA, rowB, 'date_modified');
+ },
+ filter: (rows, id, filterValue) => filterDate(rows, id, filterValue),
+ },
+ {
+ title: t('Language'),
+ accessor: 'language',
+ Filter: SelectColumnFilter,
+ },
+ {
+ title: t('Submitters'),
+ accessor: 'submitters',
+ Filter: SelectColumnFilter,
+ },
+ {
+ title: t('Authors'),
+ id: 'authors',
+ accessor: 'authors',
+ Filter: SelectColumnFilter,
+ },
+ {
+ title: t('Tags'),
+ id: 'tags',
+ accessor: 'tags',
+ Filter: SelectColumnFilter,
+ },
+ {
+ title: t('Flagged'),
+ accessor: 'flag',
+ Filter: SelectColumnFilter,
+ Cell: ({ row: { values } }) => {
+ return <>{values.flag};
+ },
+ },
+ {
+ title: t('Is Issue Report?'),
+ accessor: 'is_incident_report',
+ Filter: SelectColumnFilter,
+ Cell: ({ row: { values } }) => {
+ return <>{values.is_incident_report};
+ },
+ },
+ ];
+
+ if (isRole('incident_editor')) {
+ columns.push(
+ {
+ title: t('Editor Notes'), //TODO: only show if user is editor
+ accessor: 'editor_notes',
+ },
+ {
+ title: t('Actions'),
+ id: 'actions',
+ className: 'min-w-[120px]',
+ Cell: ({ row: { values } }) => (
+
+ ),
+ }
+ );
+ }
+
+ return columns;
+ }, [isLoggedIn]);
+
+ const table = useTable(
+ {
+ columns,
+ data,
+ defaultColumn,
+ },
+ useFilters,
+ useSortBy,
+ usePagination
+ );
+
+ const pageLength = table.page.length;
+
+ const allResultsCount = data.length;
+
+ return (
+ <>
+
+
+ {
+ setIsLiveData(checked);
+ }}
+ name="live-data-switch"
+ />
+
+
+
+
+
+ Displaying {{ pageLength }} of {{ allResultsCount }} reports
+
+
+
+
+ );
+}
diff --git a/site/gatsby-site/src/components/submissions/SubmissionForm.js b/site/gatsby-site/src/components/submissions/SubmissionForm.js
index 889e222582..6a350eb142 100644
--- a/site/gatsby-site/src/components/submissions/SubmissionForm.js
+++ b/site/gatsby-site/src/components/submissions/SubmissionForm.js
@@ -34,7 +34,7 @@ import {
faTenge,
} from '@fortawesome/free-solid-svg-icons';
import FlowbiteSearchInput from 'components/forms/FlowbiteSearchInput';
-import { Select } from 'flowbite-react';
+import { Checkbox, Select } from 'flowbite-react';
import IncidentsField from 'components/incidents/IncidentsField';
import { graphql, useStaticQuery } from 'gatsby';
@@ -348,6 +348,20 @@ const SubmissionForm = ({ onChange = null }) => {
columns={['byIncidentId']}
/>
+
+
+
+
+
+ {
+ setFieldValue('quiet', e.target.checked);
+ }}
+ />
+
+
+
{(!values.incident_ids || values.incident_ids.length === 0) && (
diff --git a/site/gatsby-site/src/components/ui/Table.js b/site/gatsby-site/src/components/ui/Table.js
index 548e91d0ef..8678633edb 100644
--- a/site/gatsby-site/src/components/ui/Table.js
+++ b/site/gatsby-site/src/components/ui/Table.js
@@ -230,6 +230,40 @@ export function formatDateField(date) {
}
}
+export function sortDateField(rowA, rowB, fieldName) {
+ if (
+ rowA.original[fieldName] &&
+ rowA.original[fieldName] !== '' &&
+ rowB.original[fieldName] &&
+ rowB.original[fieldName] !== ''
+ ) {
+ const dateRowA = new Date(rowA.original[fieldName]);
+
+ const dateRowB = new Date(rowB.original[fieldName]);
+
+ if (dateRowA > dateRowB) {
+ return 1;
+ }
+
+ if (dateRowA < dateRowB) {
+ return -1;
+ }
+
+ return 0;
+ }
+}
+
+export function filterDate(rows, id, filterValue) {
+ return rows.filter((row) => {
+ const rowValue = row.values[id];
+
+ if (!rowValue) return false;
+ const filterValueDate = new Date(rowValue).getTime();
+
+ return filterValueDate >= filterValue[0] && filterValueDate <= filterValue[1];
+ });
+}
+
export default function Table({
table,
showPagination = true,
diff --git a/site/gatsby-site/src/components/users/UsersTable.js b/site/gatsby-site/src/components/users/UsersTable.js
index fe476c8fb0..7c513be1f3 100644
--- a/site/gatsby-site/src/components/users/UsersTable.js
+++ b/site/gatsby-site/src/components/users/UsersTable.js
@@ -4,6 +4,7 @@ import Table, {
DefaultColumnFilter,
DefaultColumnHeader,
SelectDatePickerFilter,
+ filterDate,
} from 'components/ui/Table';
import { Badge, Button } from 'flowbite-react';
import UserEditModal from './UserEditModal';
@@ -40,16 +41,6 @@ export default function UsersTable({ data, className = '', ...props }) {
const client = useApolloClient();
- const filterDate = (rows, id, filterValue) =>
- rows.filter((row) => {
- const rowValue = row.values[id];
-
- if (!rowValue) return false;
- const filterValueDate = new Date(rowValue).getTime();
-
- return filterValueDate >= filterValue[0] && filterValueDate <= filterValue[1];
- });
-
useEffect(() => {
const fetchUserAdminData = async () => {
if (data) {
diff --git a/site/gatsby-site/src/graphql/incidents.js b/site/gatsby-site/src/graphql/incidents.js
index 87302391ff..084183e780 100644
--- a/site/gatsby-site/src/graphql/incidents.js
+++ b/site/gatsby-site/src/graphql/incidents.js
@@ -67,6 +67,9 @@ export const FIND_INCIDENTS_TABLE = gql`
entity_id
name
}
+ reports {
+ report_number
+ }
}
}
`;
diff --git a/site/gatsby-site/src/graphql/reports.js b/site/gatsby-site/src/graphql/reports.js
index ec247bea73..3a197086d3 100644
--- a/site/gatsby-site/src/graphql/reports.js
+++ b/site/gatsby-site/src/graphql/reports.js
@@ -34,6 +34,7 @@ export const FIND_REPORT = gql`
from_text_hash
vector
}
+ quiet
}
}
`;
@@ -58,6 +59,7 @@ export const FIND_REPORT_WITH_TRANSLATIONS = gql`
language
is_incident_report
inputs_outputs
+ quiet
translations_es: translations(input: "es") {
title
text
@@ -99,6 +101,7 @@ export const UPDATE_REPORT = gql`
report_number
editor_notes
language
+ quiet
}
}
`;
@@ -176,6 +179,7 @@ export const FIND_REPORT_HISTORY = gql`
url
source_domain
user
+ quiet
}
}
`;
@@ -202,3 +206,31 @@ export const FIND_REPORTS = gql`
}
}
`;
+
+export const FIND_REPORTS_TABLE = gql`
+ query FindReports($query: ReportQueryInput!) {
+ reports(query: $query, sort: { report_number: DESC }, limit: 999) {
+ _id
+ submitters
+ date_published
+ date_downloaded
+ date_submitted
+ date_modified
+ report_number
+ title
+ description
+ url
+ image_url
+ cloudinary_id
+ source_domain
+ text
+ authors
+ epoch_date_submitted
+ language
+ tags
+ inputs_outputs
+ editor_notes
+ is_incident_report
+ }
+ }
+`;
diff --git a/site/gatsby-site/src/graphql/submissions.js b/site/gatsby-site/src/graphql/submissions.js
index 731f84671e..249384d4e9 100644
--- a/site/gatsby-site/src/graphql/submissions.js
+++ b/site/gatsby-site/src/graphql/submissions.js
@@ -59,6 +59,7 @@ export const FIND_SUBMISSIONS = gql`
user {
userId
}
+ quiet
}
}
`;
@@ -110,6 +111,7 @@ export const FIND_SUBMISSION = gql`
editor_similar_incidents
editor_dissimilar_incidents
status
+ quiet
}
}
`;
diff --git a/site/gatsby-site/src/pages/apps/incidents.js b/site/gatsby-site/src/pages/apps/incidents.js
index 6bbad492a6..2392bf684f 100644
--- a/site/gatsby-site/src/pages/apps/incidents.js
+++ b/site/gatsby-site/src/pages/apps/incidents.js
@@ -7,41 +7,99 @@ import AiidHelmet from '../../components/AiidHelmet';
import ListSkeleton from 'elements/Skeletons/List';
import { graphql } from 'gatsby';
import { makeEntitiesHash } from 'utils/entities';
+import { Button } from 'flowbite-react';
+import ReportsTable from 'components/reports/ReportsTable';
+import { FIND_REPORTS_TABLE } from '../../graphql/reports';
+import { useQueryParam } from 'use-query-params';
const IncidentsPage = ({ data, ...props }) => {
- const { data: incidents, loading } = useQuery(FIND_INCIDENTS_TABLE);
+ const [view] = useQueryParam('view');
+
+ const { data: incidents, loading: incidentsLoading } = useQuery(FIND_INCIDENTS_TABLE);
+
+ const { data: reports, loading: reportsLoading } = useQuery(FIND_REPORTS_TABLE, {
+ variables: {
+ query: {
+ is_incident_report: true,
+ },
+ },
+ });
+
+ const { data: issueReports, loading: issueReportsLoading } = useQuery(FIND_REPORTS_TABLE, {
+ variables: {
+ query: {
+ is_incident_report: false,
+ },
+ },
+ });
const [incidentsData, setIncidentsData] = useState(null);
+ const [issueReportsData, setIssueReportsData] = useState(null);
+
+ const [reportsData, setReportsData] = useState(null);
+
const [isLiveData, setIsLiveData] = useState(false);
+ const [selectedView, setSelectedView] = useState(null);
+
useEffect(() => {
- if (isLiveData) {
- if (incidents) {
- setIncidentsData(incidents.incidents);
- }
- } else if (data?.incidents?.nodes) {
- const entitiesHash = makeEntitiesHash(data?.entities?.nodes);
-
- const incidents = [];
-
- for (const incident of data.incidents.nodes) {
- incident.AllegedDeployerOfAISystem = incident.Alleged_deployer_of_AI_system.map(
- (entity_id) => entitiesHash[entity_id]
- );
- incident.AllegedDeveloperOfAISystem = incident.Alleged_developer_of_AI_system.map(
- (entity_id) => entitiesHash[entity_id]
- );
- incident.AllegedHarmedOrNearlyHarmedParties =
- incident.Alleged_harmed_or_nearly_harmed_parties.map(
- (entity_id) => entitiesHash[entity_id]
- );
- incidents.push(incident);
- }
+ if (view) {
+ setSelectedView(view);
+ } else {
+ setSelectedView('incidents');
+ }
+ }, [view]);
- setIncidentsData(incidents);
+ useEffect(() => {
+ switch (selectedView) {
+ case 'incidents':
+ if (isLiveData && incidents) {
+ setIncidentsData(incidents.incidents);
+ } else if (data?.incidents?.nodes) {
+ const entitiesHash = makeEntitiesHash(data?.entities?.nodes);
+
+ const processedIncidents = data.incidents.nodes.map((incident) => ({
+ ...incident,
+ AllegedDeployerOfAISystem: incident.Alleged_deployer_of_AI_system.map(
+ (id) => entitiesHash[id]
+ ),
+ AllegedDeveloperOfAISystem: incident.Alleged_developer_of_AI_system.map(
+ (id) => entitiesHash[id]
+ ),
+ AllegedHarmedOrNearlyHarmedParties:
+ incident.Alleged_harmed_or_nearly_harmed_parties.map((id) => entitiesHash[id]),
+ }));
+
+ setIncidentsData(processedIncidents);
+ }
+ break;
+ case 'issueReports':
+ if (isLiveData && issueReports) {
+ setIssueReportsData(transformReports(issueReports.reports));
+ } else if (data?.issueReports?.nodes) {
+ setIssueReportsData(transformReports(data.issueReports.nodes));
+ }
+ break;
+
+ case 'reports':
+ if (isLiveData && reports) {
+ setReportsData(transformReports(reports.reports));
+ } else if (data?.reports?.nodes) {
+ setReportsData(transformReports(data.reports.nodes));
+ }
+ break;
+ default:
}
- }, [isLiveData, incidents, data]);
+ }, [isLiveData, incidents, data, selectedView]);
+
+ function transformReports(reports) {
+ return reports.map((report) => ({
+ ...report,
+ flag: report.flag ? 'Yes' : 'No',
+ is_incident_report: report.is_incident_report ? 'No' : 'Yes',
+ }));
+ }
const { t } = useTranslation();
@@ -51,18 +109,97 @@ const IncidentsPage = ({ data, ...props }) => {
{t('Incidents')}
- {(incidentsData && !isLiveData) || (incidentsData && isLiveData && !loading) ? (
-
-
-
- ) : (
-
-
-
+
+
+
+
+
+ {selectedView === 'incidents' && (
+ <>
+ {(incidentsData && !isLiveData) ||
+ (incidentsData && isLiveData && !incidentsLoading) ? (
+
+
+
+ ) : (
+
+
+
+ )}
+
+ )}
+ {selectedView === 'issueReports' && (
+ <>
+ {(issueReportsData && !isLiveData) ||
+ (issueReportsData && isLiveData && !issueReportsLoading) ? (
+
+
+
+ ) : (
+
+
+
+ )}
+
+ )}
+ {selectedView === 'reports' && (
+ <>
+ {(reportsData && !isLiveData) || (reportsData && isLiveData && !reportsLoading) ? (
+
+
+
+ ) : (
+
+
+
+ )}
+
)}
@@ -93,6 +230,51 @@ export const query = graphql`
name
}
}
+ reports: allMongodbAiidprodReports(
+ filter: { is_incident_report: { eq: true } }
+ sort: { report_number: DESC }
+ ) {
+ nodes {
+ report_number
+ title
+ url
+ authors
+ date_downloaded
+ date_modified
+ date_published
+ date_submitted
+ description
+ flag
+ image_url
+ language
+ source_domain
+ submitters
+ is_incident_report
+ }
+ }
+
+ issueReports: allMongodbAiidprodReports(
+ filter: { is_incident_report: { eq: false } }
+ sort: { report_number: DESC }
+ ) {
+ nodes {
+ report_number
+ title
+ url
+ authors
+ date_downloaded
+ date_modified
+ date_published
+ date_submitted
+ description
+ flag
+ image_url
+ language
+ source_domain
+ submitters
+ is_incident_report
+ }
+ }
}
`;
diff --git a/site/gatsby-site/src/pages/apps/reports.js b/site/gatsby-site/src/pages/apps/reports.js
deleted file mode 100644
index 614c82f01d..0000000000
--- a/site/gatsby-site/src/pages/apps/reports.js
+++ /dev/null
@@ -1,230 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import AiidHelmet from '../../components/AiidHelmet';
-import Link from '../../components/ui/Link';
-import { faLink } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { useTable, useFilters, usePagination, useSortBy } from 'react-table';
-import { gql, useQuery } from '@apollo/client';
-import { useMenuContext } from 'contexts/MenuContext';
-import ListSkeleton from 'elements/Skeletons/List';
-import { useTranslation } from 'react-i18next';
-import { Button } from 'flowbite-react';
-import Table, {
- DefaultColumnFilter,
- DefaultColumnHeader,
- formatDateField,
- SelectColumnFilter,
- SelectDatePickerFilter,
-} from 'components/ui/Table';
-
-const query = gql`
- query ReportsQuery {
- incidents(sortBy: INCIDENT_ID_ASC, limit: 9999) {
- incident_id
- reports {
- title
- source_domain
- url
- authors
- submitters
- epoch_date_submitted
- epoch_date_modified
- epoch_date_downloaded
- report_number
- flag
- date_downloaded
- date_modified
- date_submitted
- }
- }
- }
-`;
-
-export default function Incidents(props) {
- const [tableData, setTableData] = useState([]);
-
- const { data, loading } = useQuery(query);
-
- const { t } = useTranslation();
-
- useEffect(() => {
- if (!data) return;
-
- const incidentDataToCellMap = (data) => {
- const tableData = data.incidents.reduce((accumulator, incident) => {
- for (const report of incident.reports) {
- accumulator.push({
- ...report,
- incident_id: incident.incident_id,
- flag: report.flag === true ? 'Yes' : 'No',
- authors: report.authors.join(', '),
- __typename: undefined,
- });
- }
- return accumulator;
- }, []);
-
- return tableData;
- };
-
- setTableData(incidentDataToCellMap(data));
- }, [data]);
-
- const cellData = React.useMemo(() => tableData, [tableData]);
-
- const columns = React.useMemo(() => {
- const columns = [
- {
- title: t('Incident ID'),
- accessor: 'incident_id',
- Cell: ({ row: { values } }) => (
-
- Incident {values.incident_id}
-
-
- ),
- },
- {
- className: 'min-w-[240px] max-w-[400px]',
- title: t('Incident Title'),
- accessor: 'title',
- Cell: (cell) => (
-
- {cell.row.values.title}
-
- ),
- },
- {
- className: 'min-w-[240px]',
- title: t('Source Domain'),
- accessor: 'source_domain',
- width: 240,
- },
- {
- className: 'min-w-[240px]',
- title: t('Authors'),
- accessor: 'authors',
- width: 240,
- },
- {
- className: 'min-w-[240px]',
- title: t('Submitters'),
- accessor: 'submitters',
- width: 240,
- Filter: SelectColumnFilter,
- },
- {
- className: 'min-w-[240px]',
- title: t('Date Submitted'),
- accessor: 'date_submitted',
- width: 240,
- Filter: SelectDatePickerFilter,
- Cell: ({ row: { values } }) => {
- return <>{formatDateField(values.date_submitted)};
- },
- },
- {
- className: 'min-w-[240px]',
- title: t('Date Modified'),
- accessor: 'date_modified',
- width: 240,
- Filter: SelectDatePickerFilter,
- Cell: ({ row: { values } }) => {
- return <>{formatDateField(values.date_modified)};
- },
- },
- {
- className: 'min-w-[240px]',
- title: t('Date Downloaded'),
- accessor: 'date_downloaded',
- width: 240,
- Filter: SelectDatePickerFilter,
- Cell: ({ row: { values } }) => {
- return <>{formatDateField(values.date_downloaded)};
- },
- },
- {
- className: 'min-w-[240px]',
- title: t('Report ID'),
- accessor: 'report_number',
- width: 240,
- },
- {
- className: 'min-w-[240px]',
- title: t('Flagged'),
- accessor: 'flag',
- width: 240,
- Filter: SelectColumnFilter,
- Cell: ({ row: { values } }) => {
- return <>{values.flag};
- },
- },
- ];
-
- return columns;
- }, []);
-
- const defaultColumn = React.useMemo(
- () => ({
- Filter: DefaultColumnFilter,
- Header: DefaultColumnHeader,
- }),
- []
- );
-
- const filterDateFunction = (rows, id, filterValue) => {
- const start = filterValue[0];
-
- const end = filterValue[1];
-
- return rows.filter((val) => {
- return val.original[id] >= start && val.original[id] <= end;
- });
- };
-
- const filterTypes = {
- epoch_date_submitted: filterDateFunction,
- epoch_date_modified: filterDateFunction,
- date_downloaded: filterDateFunction,
- };
-
- const table = useTable(
- {
- columns,
- data: cellData,
- defaultColumn,
- filterTypes,
- initialState: { pageIndex: 0, pageSize: 100 },
- },
- useFilters,
- useSortBy,
- usePagination
- );
-
- const { isCollapsed } = useMenuContext();
-
- return (
-
-
- Incident List
-
-
- {loading &&
}
- {!loading && (
-
-
Incident Report Table
-
-
-
- )}
-
- );
-}
diff --git a/site/gatsby-site/src/pages/cite/edit.js b/site/gatsby-site/src/pages/cite/edit.js
index b0e41f8da7..9bc3bbf5fc 100644
--- a/site/gatsby-site/src/pages/cite/edit.js
+++ b/site/gatsby-site/src/pages/cite/edit.js
@@ -57,6 +57,7 @@ const reportFields = [
'url',
'embedding',
'inputs_outputs',
+ 'quiet',
];
function EditCitePage(props) {
@@ -66,7 +67,7 @@ function EditCitePage(props) {
const [reportNumber] = useQueryParam('report_number', withDefault(NumberParam, 1));
- const [incidentId] = useQueryParam('incident_id', withDefault(NumberParam, 1));
+ const [incidentId] = useQueryParam('incident_id');
const {
data: reportData,
@@ -280,11 +281,24 @@ function EditCitePage(props) {
Editing Incident Report {{ reportNumber }}
-
-
-
+ {incidentId ? (
+
+
+
+ ) : (
+
+
+
+ )}