chore(project): bootstrap project tree

client/src/gql/queries/helper.ts

@@ -0,0 +1,11 @@
+import { useQuery, DocumentNode } from "@apollo/client";
+import { useState, useEffect } from "react";
+
+export function useGraphQLData<T>(q: DocumentNode, key: string, defaultValue: T, options = {}) {
+  const query = useQuery(q, options);
+  const [ data, setData ] = useState<T>(defaultValue);
+  useEffect(() => {
+    setData(query.data ? query.data[key] as T : defaultValue);
+  }, [query.loading, query.data]);
+  return { data, loading: query.loading, error: query.error };
+}

client/src/gql/queries/user.tsx

@@ -0,0 +1,25 @@
+import { gql, useQuery } from '@apollo/client';
+import { User } from '../../types/user';
+import { useGraphQLData } from './helper';
+
+export const QUERY_CURRENT_USER = gql`
+query userProfile {
+  currentUser {
+    id,
+    name,
+    email,
+    createdAt,
+    connectedAt
+  }
+}`;
+
+export function useUserProfileQuery() {
+  return useQuery(QUERY_CURRENT_USER);
+}
+
+export function useUserProfile() {
+  const { data, loading, error } = useGraphQLData<User>(
+    QUERY_CURRENT_USER, 'currentUser', {id: '', email: ''}
+  );
+  return { user: data, loading, error };
+}