refactor: remove unused SentryErrorButton component and adjust related files

- Deleted the SentryErrorButton component as it was not needed.
- Updated the cookbook page to remove the SentryErrorButton reference.
- Adjusted the search component to fix a self-closing tag issue.
- Ensured the toggleLike function call is correctly formatted in the view component.
- Added sendDefaultPii option to Sentry configuration for improved error tracking.

components/SentryErrorButton.vue

@@ -1,91 +0,0 @@
-<!--
-This is just a very simple component that throws an example error.
-Feel free to delete this file.
--->
-
-<script setup>
-import * as Sentry from "@sentry/nuxt";
-
-const hasSentError = ref(false);
-
-const throwError = () => {
-  Sentry.startSpan(
-    {
-      name: "Example Frontend Span",
-      op: "test",
-    },
-    () => {
-      hasSentError.value = true;
-      throw new Error("Sentry Example Error");
-    },
-  );
-};
-</script>
-
-<template>
-  <div v-if="hasSentError" class="success">
-    Sample error was sent to Sentry.
-  </div>
-  <button v-else @click="throwError">
-    <span>Throw Sample Error</span>
-  </button>
-</template>
-
-<style scoped>
-button {
-  border-radius: 8px;
-  color: white;
-  cursor: pointer;
-  background-color: #553db8;
-  border: none;
-  padding: 0;
-  margin-top: 4px;
-  font-family:
-    system-ui,
-    -apple-system,
-    BlinkMacSystemFont,
-    "Segoe UI",
-    Roboto,
-    "Helvetica Neue",
-    sans-serif;
-
-  & > span {
-    display: inline-block;
-    padding: 12px 16px;
-    border-radius: inherit;
-    font-size: 20px;
-    font-weight: bold;
-    line-height: 1;
-    background-color: #7553ff;
-    border: 1px solid #553db8;
-    transform: translateY(-4px);
-  }
-
-  &:hover > span {
-    transform: translateY(-8px);
-  }
-
-  &:active > span {
-    transform: translateY(0);
-  }
-}
-
-.success {
-  width: max-content;
-  padding: 12px 16px;
-  border-radius: 8px;
-  font-size: 20px;
-  line-height: 1;
-  background-color: #00f261;
-  border: 1px solid #00bf4d;
-  color: #181423;
-  font-family:
-    system-ui,
-    -apple-system,
-    BlinkMacSystemFont,
-    "Segoe UI",
-    Roboto,
-    "Helvetica Neue",
-    sans-serif;
-}
-</style>

components/recipe/search.vue

@@ -10,7 +10,7 @@
       :autofocus="autofocus"
       @focus="isFocused = true"
       @blur="isFocused = false"
-    />
+    >
     <kbd
       class="hidden md:inline-block kbd kbd-sm"
       :class="{ 'opacity-50': !isFocused }"

components/recipe/view.vue

@@ -78,8 +78,8 @@ const shareRecipe = async (recipe: Recipe) => {
         </button>
         <button
           class="btn btn-ghost"
-          @click="toggleLike(recipe.id)"
           :class="{ 'text-red-500': likedRecipes.has(recipe.id) }"
+          @click="toggleLike(recipe.id)"
         >
           <icon
             :name="likedRecipes.has(recipe.id) ? 'uil:heart' : 'uil:heart-alt'"

pages/cookbook.vue

@@ -6,7 +6,6 @@ const cookbook = useStorage<Recipe[]>("cookbook", [], localStorage);
 
 <template>
   <main>
-    <sentry-error-button />
     <div
       v-if="cookbook.length === 0"
       class="flex justify-center items-center min-h-screen"

sentry.client.config.ts

@@ -17,6 +17,7 @@ Sentry.init({
   ],
   // Setting this option to true will print useful information to the console while you're setting up Sentry.
   debug: false,
+  sendDefaultPii: true,
   _experiments: {
     enableLogs: true,
   },