feat: Remove Explore URLs and make the normal URLs public (#2632)

* add groupSlug to most routes

* fixed more routing issues

* fixed jank and incorrect routes

* remove public explore links

* remove unused groupSlug and explore routes

* nuked explore pages

* fixed public toolstore bug

* fixed various routes missing group slug

* restored public app header menu

* fix janky login redirect

* 404 recipe API call returns to login

* removed unused explore layout

* force redirect when using the wrong group slug

* fixed dead admin links

* removed unused middleware from earlier attempt

* 🧹

* improve cookbooks sidebar
fixed sidebar link not working
fixed sidebar link target
hide cookbooks header when there are none

* added group slug to user

* fix $auth typehints

* vastly simplified groupSlug logic

* allow logged-in users to view other groups

* fixed some edgecases that bypassed isOwnGroup

* fixed static home ref

* 🧹

* fixed redirect logic

* lint warning

* removed group slug from group and user pages
refactored all components to use route groupSlug or user group slug
moved some group pages to recipe pages

* fixed some bad types

* 🧹

* moved groupSlug routes under /g/groupSlug

* move /recipe/ to /r/

* fix backend url generation and metadata injection

* moved shopping lists to root/other route fixes

* changed shared from /recipes/ to /r/

* fixed 404 redirect not awaiting

* removed unused import

* fix doc links

* fix public recipe setting not affecting public API

* fixed backend tests

* fix nuxt-generate command

---------

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

frontend/pages/g/_groupSlug/recipes/categories/index.vue

@@ -0,0 +1,37 @@
+<template>
+  <v-container>
+    <RecipeOrganizerPage
+      v-if="items"
+      :items="items"
+      :icon="$globals.icons.categories"
+      item-type="categories"
+      @delete="actions.deleteOne"
+      @update="actions.updateOne"
+    >
+      <template #title> {{ $tc("category.categories") }} </template>
+    </RecipeOrganizerPage>
+  </v-container>
+</template>
+
+<script lang="ts">
+import { defineComponent } from "@nuxtjs/composition-api";
+import RecipeOrganizerPage from "~/components/Domain/Recipe/RecipeOrganizerPage.vue";
+import { useCategoryStore } from "~/composables/store";
+
+export default defineComponent({
+  components: {
+    RecipeOrganizerPage,
+  },
+  setup() {
+    const { items, actions } = useCategoryStore();
+
+    return {
+      items,
+      actions,
+    };
+  },
+  head: {
+    title: "Categories",
+  },
+});
+</script>

frontend/pages/g/_groupSlug/recipes/tags/index.vue

@@ -0,0 +1,39 @@
+<template>
+  <v-container>
+    <RecipeOrganizerPage
+      v-if="items"
+      :items="items"
+      :icon="$globals.icons.tags"
+      item-type="tags"
+      @delete="actions.deleteOne"
+      @update="actions.updateOne"
+    >
+      <template #title> {{ $t("tag.tags") }} </template>
+    </RecipeOrganizerPage>
+  </v-container>
+</template>
+
+<script lang="ts">
+import { defineComponent } from "@nuxtjs/composition-api";
+import RecipeOrganizerPage from "~/components/Domain/Recipe/RecipeOrganizerPage.vue";
+import { useTagStore } from "~/composables/store";
+
+export default defineComponent({
+  components: {
+    RecipeOrganizerPage,
+  },
+  setup() {
+    const { items, actions } = useTagStore();
+
+    return {
+      items,
+      actions,
+    };
+  },
+  head() {
+    return {
+      title: this.$tc("tag.tags"),
+    };
+  },
+});
+</script>

frontend/pages/g/_groupSlug/recipes/timeline.vue

@@ -0,0 +1,49 @@
+<template>
+  <v-sheet :class="$vuetify.breakpoint.smAndDown ? 'pa-0' : 'px-3 py-0'">
+    <BasePageTitle v-if="groupName" divider>
+      <template #header>
+        <v-img max-height="200" max-width="150" :src="require('~/static/svgs/manage-members.svg')" />
+      </template>
+      <template #title> {{ $t("recipe.group-global-timeline", { groupName }) }} </template>
+    </BasePageTitle>
+    <RecipeTimeline v-if="queryFilter" v-model="ready" show-recipe-cards :query-filter="queryFilter" />
+  </v-sheet>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from "@nuxtjs/composition-api";
+import { useUserApi } from "~/composables/api";
+import RecipeTimeline from "~/components/Domain/Recipe/RecipeTimeline.vue";
+
+export default defineComponent({
+  components: { RecipeTimeline },
+  setup() {
+    const api = useUserApi();
+    const ready = ref<boolean>(false);
+
+    const groupName = ref<string>("");
+    const queryFilter = ref<string>("");
+    async function fetchGroup() {
+      const { data } = await api.groups.getCurrentUserGroup();
+      if (data) {
+        queryFilter.value = `recipe.group_id="${data.id}"`;
+        groupName.value = data.name;
+      }
+
+      ready.value = true;
+    }
+
+    fetchGroup();
+    return {
+      groupName,
+      queryFilter,
+      ready,
+    };
+  },
+  head() {
+    return {
+      title: this.$t("recipe.timeline") as string,
+    };
+  },
+});
+</script>

frontend/pages/g/_groupSlug/recipes/tools/index.vue

@@ -0,0 +1,41 @@
+<template>
+  <v-container>
+    <RecipeOrganizerPage
+      v-if="tools"
+      :icon="$globals.icons.potSteam"
+      :items="tools"
+      item-type="tools"
+      @delete="actions.deleteOne"
+      @update="actions.updateOne"
+    >
+      <template #title> {{ $t("tool.tools") }} </template>
+    </RecipeOrganizerPage>
+  </v-container>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from "@nuxtjs/composition-api";
+import RecipeOrganizerPage from "~/components/Domain/Recipe/RecipeOrganizerPage.vue";
+import { useToolStore } from "~/composables/store";
+
+export default defineComponent({
+  components: {
+    RecipeOrganizerPage,
+  },
+  setup() {
+    const toolStore = useToolStore();
+    const dialog = ref(false);
+
+    return {
+      dialog,
+      tools: toolStore.items,
+      actions: toolStore.actions,
+    };
+  },
+  head() {
+    return {
+      title: this.$tc("tool.tools"),
+    };
+  },
+});
+</script>