feat(frontend): 🚧 CRUD Functionality

frontend/composables/use-api.ts

@@ -56,7 +56,7 @@ function getRequests(axoisInstance: NuxtAxiosInstance): ApiRequestInstance {
 
 
 
-export const useApi = function (): Api {
+export const useApiSingleton = function (): Api {
   const { $axios } = useContext();
   const requests = getRequests($axios);
 

frontend/composables/use-recipe-context.ts

@@ -0,0 +1,38 @@
+import {  useAsync, ref } from "@nuxtjs/composition-api";
+import { useApiSingleton } from "~/composables/use-api";
+import { Recipe } from "~/types/api-types/recipe";
+
+export const useRecipeContext = function () {
+  const api = useApiSingleton();
+  const loading = ref(false)
+
+
+  function getBySlug(slug: string) {
+    loading.value = true
+    const recipe = useAsync(async () => {
+      const { data } = await api.recipes.getOne(slug);
+      return data;
+    }, slug);
+
+    loading.value = false
+
+    return recipe;
+  }
+
+  async function  deleteRecipe(slug: string) {
+    loading.value = true
+    const { data } = await api.recipes.deleteOne(slug);
+    loading.value = false
+    return data;
+  }
+
+  async function updateRecipe(slug: string, recipe: Recipe) {
+    loading.value = true
+    const { data } = await api.recipes.updateOne(slug, recipe);
+    loading.value = false
+    return data;
+  }
+
+
+  return {loading, getBySlug, deleteRecipe, updateRecipe}
+};

frontend/composables/use-validators.ts

@@ -1,8 +1,11 @@
 const EMAIL_REGEX =
   /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@(([[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
 
+const URL_REGEX = /^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,256}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)$/gm;
+
 export const validators = {
   required: (v: string) => !!v || "This Field is Required",
   email: (v: string) => !v || EMAIL_REGEX.test(v) || "Email Must Be Valid",
-  whitespace: (v: string) => !v || v.split(" ").length <= 1 || "No Whitespace Allowed"
+  whitespace: (v: string) => !v || v.split(" ").length <= 1 || "No Whitespace Allowed",
+  url: (v: string) => !v || URL_REGEX.test(v) || "Must Be A Valid URL",
 }