feat: Public Recipe Browser (#2525)

* fixed incorrect var ref

* added public recipe pagination route

* refactored frontend public/explore API

* fixed broken public cards

* hid context menu from cards when public

* fixed public app header

* fixed random recipe

* added public food, category, tag, and tool routes

* not sure why I thought that would work

* added public organizer/foods stores

* disabled clicking on tags/categories

* added public link to profile page

* linting

* force a 404 if the group slug is missing or invalid

* oops

* refactored to fit sidebar into explore

* fixed invalid logic for app header

* removed most sidebar options from public

* added backend routes for public cookbooks

* added explore cookbook pages/apis

* codegen

* added backend tests

* lint

* fixes v-for keys

* I do not understand but sure why not

---------

Co-authored-by: Hayden <64056131+hay-kot@users.noreply.github.com>

frontend/components/Domain/Cookbook/CookbookPage.vue

@@ -0,0 +1,74 @@
+<template>
+    <v-container v-if="book" fluid>
+      <v-app-bar color="transparent" flat class="mt-n1 rounded">
+        <v-icon large left> {{ $globals.icons.pages }} </v-icon>
+        <v-toolbar-title class="headline"> {{ book.name }} </v-toolbar-title>
+      </v-app-bar>
+      <v-card flat>
+        <v-card-text class="py-0">
+          {{ book.description }}
+        </v-card-text>
+      </v-card>
+
+      <v-container class="pa-0">
+        <RecipeCardSection
+          class="mb-5 mx-1"
+          :recipes="recipes"
+          :query="{ cookbook: slug }"
+          :group-slug="groupSlug"
+          @sortRecipes="assignSorted"
+          @replaceRecipes="replaceRecipes"
+          @appendRecipes="appendRecipes"
+          @delete="removeRecipe"
+        />
+      </v-container>
+    </v-container>
+  </template>
+
+  <script lang="ts">
+  import { computed, defineComponent, useRoute, ref, useContext, useMeta } from "@nuxtjs/composition-api";
+  import { useLazyRecipes } from "~/composables/recipes";
+  import RecipeCardSection from "@/components/Domain/Recipe/RecipeCardSection.vue";
+  import { useCookbook } from "~/composables/use-group-cookbooks";
+
+  export default defineComponent({
+    components: { RecipeCardSection },
+    props: {
+      groupSlug: {
+        type: String,
+        default: undefined,
+      }
+    },
+    setup(props) {
+      const { $auth } = useContext();
+      const loggedIn = computed(() => $auth.loggedIn);
+
+      const { recipes, appendRecipes, assignSorted, removeRecipe, replaceRecipes } = useLazyRecipes(loggedIn.value ? null : props.groupSlug);
+
+      const route = useRoute();
+      const slug = route.value.params.slug;
+      const { getOne } = useCookbook(loggedIn.value ? null : props.groupSlug);
+
+      const tab = ref(null);
+      const book = getOne(slug);
+
+      useMeta(() => {
+        return {
+          title: book?.value?.name || "Cookbook",
+        };
+      });
+
+      return {
+        book,
+        slug,
+        tab,
+        appendRecipes,
+        assignSorted,
+        recipes,
+        removeRecipe,
+        replaceRecipes,
+      };
+    },
+    head: {}, // Must include for useMeta
+  });
+  </script>