Only show user registration feedback when relevant

app/routes/events/components/EventAdministrate/Allergies.tsx

@@ -27,7 +27,9 @@ export const canSeeAllergies = (
 
 const Allergies = () => {
   const { eventId } = useParams<{ eventId: string }>();
-  const event = useAppSelector((state) => selectEventById(state, { eventId }));
+  const event = useAppSelector((state) =>
+    selectEventById(state, { eventId })
+  ) as AdministrateEvent;
   const { registered } = useAppSelector((state) =>
     getRegistrationGroups(state, {
       eventId,

app/routes/events/components/EventAdministrate/AttendeeElements.tsx

@@ -66,7 +66,7 @@ export const PresenceIcons = ({ presence, registrationId }: PresenceProps) => {
   const dispatch = useAppDispatch();
 
   return (
-    <Flex justifyContent="center" gap={5}>
+    <Flex justifyContent="center">
       <TooltipIcon
         content="Til stede"
         iconClass={cx('fa fa-check', styles.greenIcon)}
@@ -103,7 +103,7 @@ export const StripeStatus = ({
   const dispatch = useAppDispatch();
 
   return (
-    <Flex justifyContent="center" gap={5}>
+    <Flex justifyContent="center">
       <TooltipIcon
         content="Betalt via Stripe"
         iconClass={cx('fa fa-cc-stripe', styles.greenIcon)}
@@ -154,14 +154,16 @@ export const Unregister = ({ fetching, registration }: UnregisterProps) => {
           closeOnConfirm
         >
           {({ openConfirmModal }) => (
-            <Tooltip content="Meld av bruker">
-              <Icon
-                onClick={openConfirmModal}
-                name="person-remove-outline"
-                size={18}
-                danger
-              />
-            </Tooltip>
+            <Flex justifyContent="center">
+              <Tooltip content="Meld av bruker">
+                <Icon
+                  onClick={openConfirmModal}
+                  name="person-remove-outline"
+                  size={18}
+                  danger
+                />
+              </Tooltip>
+            </Flex>
           )}
         </ConfirmModal>
       )}

app/routes/events/components/EventAdministrate/Attendees.tsx

@@ -18,10 +18,13 @@ import { useUserContext } from 'app/routes/app/AppRoute';
 import { useAppSelector } from 'app/store/hooks';
 import styles from './Abacard.css';
 import { RegisteredTable, UnregisteredTable } from './RegistrationTables';
+import type { AdministrateEvent } from 'app/store/models/Event';
 
 const Attendees = () => {
   const { eventId } = useParams<{ eventId: string }>();
-  const event = useAppSelector((state) => selectEventById(state, { eventId }));
+  const event = useAppSelector((state) =>
+    selectEventById(state, { eventId })
+  ) as AdministrateEvent;
   const pools = useAppSelector((state) =>
     event?.isMerged
       ? selectMergedPoolWithRegistrations(state, { eventId })
@@ -69,10 +72,13 @@ const Attendees = () => {
     moment().isBefore(moment(event.endTime).add(1, 'day')) ||
     moment().isBefore(event.unregistrationCloseTime) ||
     moment().isBefore(event.registrationCloseTime);
+
   const exportInfoMessage = `Informasjonen du eksporterer MÅ slettes når det ikke lenger er behov for den,
                 og skal kun distribueres gjennom e-post. Dersom informasjonen skal deles med personer utenfor Abakus
                 må det spesifiseres for de påmeldte hvem informasjonen skal deles med.`;
 
+  const eventHasEnded = moment().isAfter(moment(event.endTime));
+
   const createInfoCSV = async () => {
     const data = registered.map((registration) => ({
       name: registration.user.fullName,
@@ -125,19 +131,27 @@ const Attendees = () => {
         <div>
           <strong>Påmeldte:</strong>
           <div className={styles.attendeeStatistics}>
-            {`${registerCount}/${event.registrationCount} har møtt opp`}
+            {`${registerCount}/${event.registrationCount} ${
+              eventHasEnded ? 'møtte opp' : 'har møtt opp'
+            }`}
           </div>
           <div className={styles.attendeeStatistics}>
-            {`${adminRegisterCount}/${event.registrationCount} er adminpåmeldt`}
+            {`${adminRegisterCount}/${event.registrationCount} ${
+              eventHasEnded ? 'ble' : 'er'
+            } adminpåmeldt`}
           </div>
           <div className={styles.attendeeStatistics}>
             {registeredPaidCount > 0
-              ? `${registeredPaidCount}/${event.registrationCount} registrerte har betalt`
+              ? `${registeredPaidCount}/${
+                  event.registrationCount
+                } registrerte ${eventHasEnded ? 'betalte' : 'har betalt'}`
               : ''}
           </div>
           <div className={styles.attendeeStatistics}>
             {unRegisteredPaidCount > 0
-              ? `${unRegisteredPaidCount}/${unregistered.length} avregistrerte har betalt`
+              ? `${unRegisteredPaidCount}/${
+                  unregistered.length
+                } avregistrerte ${eventHasEnded ? 'betalte' : 'har betalt'}`
               : ''}
           </div>
         </div>

app/routes/events/components/EventAdministrate/RegistrationTables.tsx

@@ -202,6 +202,16 @@ export const RegisteredTable = ({
     },
   };
 
+  const hasNonEmptyFeedback = pools.some((pool) =>
+    pool.registrations.some(
+      (registration) => registration.feedback?.trim() !== ''
+    )
+  );
+  const showFeedback =
+    event.feedbackRequired ||
+    (event.feedbackDescription && event.feedbackDescription !== '') ||
+    hasNonEmptyFeedback;
+
   const columns = [
     {
       title: '#',
@@ -318,11 +328,11 @@ export const RegisteredTable = ({
         return paymentStatusA > paymentStatusB ? 1 : -1;
       },
     },
-    {
+    showFeedback && {
       title: 'Tilbakemelding',
       dataIndex: 'feedback',
       centered: false,
-      render: (feedback) => <span>{feedback || '-'}</span>,
+      render: (feedback) => <span>{feedback || ''}</span>,
       sorter: (a, b) => a.feedback.localeCompare(b.feedback),
     },
     {
@@ -332,7 +342,7 @@ export const RegisteredTable = ({
         <Unregister fetching={fetching} registration={registration} />
       ),
     },
-  ];
+  ].filter(Boolean);
 
   return (
     <Table