fix: location chips in table view

web/components/patients/LocationChips.tsx

@@ -1,6 +1,6 @@
 import { Chip, Tooltip } from '@helpwave/hightide'
 import { MapPin } from 'lucide-react'
-import { formatLocationPath } from '@/utils/location'
+import { formatLocationPath, getLocationDisplayParts } from '@/utils/location'
 import Link from 'next/link'
 import type { LocationType } from '@/api/gql/generated'
 import { useTasksTranslation } from '@/i18n/useTasksTranslation'
@@ -46,6 +46,7 @@ export const LocationChips = ({ locations, disableLink = false, small = false, p
 
   const remainingCount = locations.length - 1
   const remainingLocations = locations.slice(1)
+  const displayParts = getLocationDisplayParts(firstLocation)
 
   const chipContent = (
     <Chip
@@ -55,10 +56,10 @@ export const LocationChips = ({ locations, disableLink = false, small = false, p
     >
       <div className="flex items-center gap-1">
         <MapPin className="size-force-3 print:hidden" />
-        <span>{firstLocation?.title}</span>
-        {firstLocation?.kind && (
-          <span className={`text-[10px] font-bold px-1.5 py-0.5 rounded uppercase tracking-wider ${getKindStyles(firstLocation.kind)}`}>
-            {translation('locationType', { type: firstLocation.kind })}
+        <span>{displayParts.mainText || firstLocation?.title}</span>
+        {(displayParts.pillContent ?? displayParts.pillKind) && (
+          <span className={`text-[10px] font-bold px-1.5 py-0.5 rounded uppercase tracking-wider ${getKindStyles(displayParts.pillKind ?? undefined)}`}>
+            {displayParts.pillContent ?? (displayParts.pillKind ? translation('locationType', { type: displayParts.pillKind }) : null)}
           </span>
         )}
       </div>

web/utils/location.ts

@@ -1,3 +1,4 @@
+import { LocationType } from '@/api/gql/generated'
 import type { LocationNodeType } from '@/api/gql/generated'
 
 export const LOCATION_PATH_SEPARATOR = ' / '
@@ -8,6 +9,14 @@ type PartialLocationNode = {
   parent?: PartialLocationNode | null,
 }
 
+type LocationNodeWithKind = PartialLocationNode & { kind?: LocationType }
+
+export type LocationDisplayParts = {
+  mainText: string,
+  pillContent: string | null,
+  pillKind: LocationType | null,
+}
+
 export const buildLocationPath = (location: PartialLocationNode | LocationNodeType | null | undefined): string[] => {
   if (!location) return []
 
@@ -26,6 +35,27 @@ export const formatLocationPath = (location: PartialLocationNode | LocationNodeT
   return buildLocationPath(location).join(separator)
 }
 
+export const getLocationDisplayParts = (location: LocationNodeWithKind | LocationNodeType | null | undefined): LocationDisplayParts => {
+  if (!location) return { mainText: '', pillContent: null, pillKind: null }
+  const fullPath = formatLocationPath(location)
+  const kind = 'kind' in location ? location.kind : undefined
+  if (kind === LocationType.Bed && location.parent?.parent) {
+    return {
+      mainText: [location.parent.parent.title, location.parent.title].join(LOCATION_PATH_SEPARATOR),
+      pillContent: location.title,
+      pillKind: LocationType.Bed,
+    }
+  }
+  if (kind === LocationType.Bed && location.parent) {
+    return {
+      mainText: location.parent.title,
+      pillContent: location.title,
+      pillKind: LocationType.Bed,
+    }
+  }
+  return { mainText: fullPath, pillContent: null, pillKind: kind ?? null }
+}
+
 export const buildLocationPathFromId = (
   locationId: string | null | undefined,
   allLocations: Map<string, { id: string, title: string, parentId?: string | null }>