Merge pull request #190 from r00tat/feature/group-markers-in-print

group markers in print
r00tat · Nov 7, 2024 · 9ee4167 · 9ee4167
2 parents 00b7614 + 8a9c018
commit 9ee4167
Show file tree

Hide file tree

Showing 2 changed files with 25 additions and 4 deletions.
diff --git a/src/components/pages/FahrzeugePrint.tsx b/src/components/pages/FahrzeugePrint.tsx
@@ -7,6 +7,8 @@ import useVehicles from '../../hooks/useVehicles';
 import { getItemInstance } from '../FirecallItems/elements';
 import { useMemo } from 'react';
 import { FirecallItem } from '../firebase/firestore';
+import { useFirecallLayers } from '../../hooks/useFirecallLayers';
+import React from 'react';
 
 interface FcItemRowProps {
   item: FirecallItem;
@@ -31,6 +33,7 @@ function FcItemRow({ item }: FcItemRowProps) {
 
 export default function FahrzeugePrint() {
   const { vehicles, rohre, otherItems: others } = useVehicles();
+  const layers = useFirecallLayers();
   const otherItems = [...rohre, ...others];
 
   return (
@@ -94,8 +97,23 @@ export default function FahrzeugePrint() {
           </tr>
         </thead>
         <tbody>
-          {otherItems.map((item) => (
-            <FcItemRow key={item.id} item={item} />
+          {otherItems
+            .filter((item) => item.layer === undefined)
+            .map((item) => (
+              <FcItemRow key={item.id} item={item} />
+            ))}
+          {Object.values(layers).map((l) => (
+            <React.Fragment key={l.id || 'default-layer'}>
+              <tr>
+                <th> </th>
+                <th>{l.name}</th>
+              </tr>
+              {otherItems
+                .filter((item) => item.layer === l.id)
+                .map((item) => (
+                  <FcItemRow key={item.id} item={item} />
+                ))}
+            </React.Fragment>
           ))}
         </tbody>
       </table>

diff --git a/src/hooks/useFirecallLayers.ts b/src/hooks/useFirecallLayers.ts
@@ -1,6 +1,6 @@
 'use client';
 
-import React, { useContext } from 'react';
+import React, { useContext, useMemo } from 'react';
 import { SimpleMap } from '../common/types';
 import {
   FIRECALL_COLLECTION_ID,
@@ -29,5 +29,8 @@ export function useFirecallLayersFromFirstore(): FirecallLayers {
     queryConstraints: [orderBy('name', 'asc')],
   });
 
-  return Object.fromEntries(layers.map((l) => [l.id, l]));
+  return useMemo(
+    () => Object.fromEntries(layers.map((l) => [l.id, l])),
+    [layers]
+  );
 }