feat: added user & login methods

src/runtime/composables/useDirectus.ts

@@ -0,0 +1,35 @@
+import type { FetchError, FetchOptions } from "ohmyfetch";
+import { useNuxtApp } from "#app";
+import { useDirectusUrl } from "./useDirectusUrl";
+import { useDirectusToken } from "./useDirectusToken";
+
+export const useDirectus = () => {
+  const nuxt = useNuxtApp();
+  const baseURL = useDirectusUrl();
+  const token = useDirectusToken();
+
+  return async <T>(
+    url: string,
+    fetchOptions: FetchOptions = {}
+  ): Promise<T> => {
+    const headers: HeadersInit = {};
+
+    if (token && token.value) {
+      headers.Authorization = `Bearer ${token.value}`;
+    }
+
+    try {
+      return await $fetch<T>(url, {
+        baseURL,
+        ...fetchOptions,
+        headers: {
+          ...headers,
+          ...fetchOptions.headers,
+        },
+      });
+    } catch (err: any) {
+      //   nuxt.hooks.callHook("direcuts:error" as any, e);
+      throw err;
+    }
+  };
+};

src/runtime/composables/useDirectusAuth.ts

@@ -0,0 +1,73 @@
+import type { Ref } from "vue";
+import type {
+  DirectusAuthResponse,
+  DirectusAuthCredentials,
+  DirectusUser,
+} from "../types";
+import { useDirectus } from "./useDirectus";
+import { useDirectusUser } from "./useDirectusUser";
+import { useDirectusUrl } from "./useDirectusUrl";
+import { useDirectusToken } from "./useDirectusToken";
+
+export const useDirectusAuth = () => {
+  const url = useDirectusUrl();
+  const directus = useDirectus();
+  const user = useDirectusUser();
+  const token = useDirectusToken();
+
+  const setToken = (value: string | null) => {
+    token.value = value;
+  };
+
+  const setUser = (value: DirectusUser) => {
+    user.value = value;
+  };
+
+  const fetchUser = async (): Promise<Ref<DirectusUser>> => {
+    if (token.value && !user.value) {
+      try {
+        user.value = await directus("/users/me");
+      } catch (e) {
+        setToken(null);
+      }
+    }
+
+    return user;
+  };
+
+  /**
+   * Login
+   *
+   * @param  {DirectusAuthCredentials} data - User authentication credentials
+   * @param  {string} data.email - The email or username of the user
+   * @param  {string} data.password - The password of the user
+   * @returns Promise<DirectusAuthResponse>
+   */
+  const login = async (
+    data: DirectusAuthCredentials
+  ): Promise<DirectusAuthResponse> => {
+    setToken(null);
+
+    const response: DirectusAuthResponse = await directus("/auth/login", {
+      method: "POST",
+      body: data,
+    });
+
+    setToken(response.data.access_token);
+
+    const user = await fetchUser();
+
+    return {
+      user,
+      access_token: response.data.access_token,
+      expires: response.data.expires,
+    };
+  };
+
+  return {
+    setToken,
+    setUser,
+    fetchUser,
+    login,
+  };
+};

src/runtime/composables/useDirectusUser.ts

@@ -0,0 +1,6 @@
+import type { Ref } from "vue";
+import { useState } from "#app";
+import type { DirectusUser } from "../types";
+
+export const useDirectusUser = (): Ref<DirectusUser> =>
+  useState<DirectusUser>("directus.user");