Fixed issue causing reviews from other issues not to be displayed

src/components/RestaurantsTable.vue

@@ -16,7 +16,13 @@ const props = defineProps({
 
 const columns = [
   { data: "name", title: "Name" },
-  { data: "tags", title: "Tags" },
+  {
+    data: "tags",
+    title: "Tags",
+    render: {
+      _: "[, ]",
+    },
+  },
   { data: "average_rating", title: "" },
 ];
 

src/components/ReviewsList.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { onMounted, ref, watch } from "vue";
+import { ref, watch } from "vue";
 import { pb } from "../pocketbase";
 import RatingField from "./RatingField.vue";
 
@@ -10,11 +10,26 @@ const props = defineProps({
 const reviews = ref<Object[]>([]);
 
 async function load(restaurantId: string) {
-  reviews.value = await pb.collection("reviews").getFullList({
+  const _reviews = await pb.collection("reviews").getFullList({
     filter: pb.filter("restaurant ~ {:id}", { id: restaurantId }),
-    expand: "user",
     sort: "-created",
   });
+
+  const users = await pb.collection("public_users").getFullList();
+
+  const usersmap: Record<string, string> = users.reduce(
+    (previous, current) => ({
+      ...previous,
+      [current.id]: current.username,
+    }),
+    {}
+  );
+
+  _reviews.forEach((review) => {
+    review.username = usersmap[review.user];
+  });
+
+  reviews.value = _reviews;
 }
 
 watch(
@@ -48,7 +63,7 @@ defineExpose({ refresh });
   <template v-for="review in reviews" :key="review.id">
     <div class="card card-compact bg-base-100 shadow-xl">
       <div class="card-body">
-        <h2 class="card-title">{{ review.expand.user.username }}</h2>
+        <h2 class="card-title">{{ review.username }}</h2>
         <div class="flex flex-row">
           <p class="text-left">{{ review.text }}</p>
         </div>