@vuer-ai/vuer-uikit 0.0.109 → 0.0.113

package/dist/ui/tree-view-legacy.mjs

@@ -1,9 +1,10 @@
-export { TreeEntries, TreeEntryItem, TreeSearchBar, TreeView } from '../chunk-QZUTRJSP.mjs';
-import '../chunk-5MBEK77I.mjs';
-import '../chunk-LRSDE62T.mjs';
+export { TreeEntries, TreeEntryItem, TreeSearchBar, TreeView } from '../chunk-DHMLQTQ6.mjs';
+import '../chunk-57MAUYQZ.mjs';
+import '../chunk-XMQULAAU.mjs';
 import '../chunk-BNDRHLLZ.mjs';
 import '../chunk-PDOFOJ4P.mjs';
 import '../chunk-F7ZHPSLA.mjs';
+import '../chunk-IDUVYPN7.mjs';
 import '../chunk-3QT5VABC.mjs';
 import '../chunk-XHJDRQD7.mjs';
 import '../chunk-LQOPO4KU.mjs';
@@ -11,6 +12,5 @@ import '../chunk-U3LN5NB6.mjs';
 import '../chunk-IZARTVYN.mjs';
 import '../chunk-VA4LUFKD.mjs';
 import '../chunk-4F2GSF2T.mjs';
-import '../chunk-IDUVYPN7.mjs';
 import '../chunk-HMN4IKTG.mjs';
 import '../chunk-SAGQV2YZ.mjs';

package/dist/ui/waterfall/CursorOverlay.cjs

@@ -2,6 +2,7 @@
 
 var chunk2J75MYQA_cjs = require('../../chunk-2J75MYQA.cjs');
 require('../../chunk-QN4N4I3Z.cjs');
+require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-Q7E73DVJ.cjs');
 require('../../chunk-JR4TVE43.cjs');
 require('../../chunk-VXZURKMQ.cjs');
@@ -9,7 +10,6 @@ require('../../chunk-Q4XH2Z5M.cjs');
 require('../../chunk-6BOWMGFG.cjs');
 require('../../chunk-YZIR6LIY.cjs');
 require('../../chunk-RPTRTGC2.cjs');
-require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-OHIB3TEN.cjs');
 
 

package/dist/ui/waterfall/CursorOverlay.mjs

@@ -1,5 +1,6 @@
 export { CursorOverlay } from '../../chunk-SA5WKLYB.mjs';
 import '../../chunk-F7ZHPSLA.mjs';
+import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-3QT5VABC.mjs';
 import '../../chunk-XHJDRQD7.mjs';
 import '../../chunk-LQOPO4KU.mjs';
@@ -7,5 +8,4 @@ import '../../chunk-U3LN5NB6.mjs';
 import '../../chunk-IZARTVYN.mjs';
 import '../../chunk-VA4LUFKD.mjs';
 import '../../chunk-4F2GSF2T.mjs';
-import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-HMN4IKTG.mjs';

package/dist/ui/waterfall/TimelineEvent.cjs

@@ -3,6 +3,7 @@
 var chunkTUYG6BYZ_cjs = require('../../chunk-TUYG6BYZ.cjs');
 require('../../chunk-G2ZYONQO.cjs');
 require('../../chunk-QN4N4I3Z.cjs');
+require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-Q7E73DVJ.cjs');
 require('../../chunk-JR4TVE43.cjs');
 require('../../chunk-VXZURKMQ.cjs');
@@ -10,7 +11,6 @@ require('../../chunk-Q4XH2Z5M.cjs');
 require('../../chunk-6BOWMGFG.cjs');
 require('../../chunk-YZIR6LIY.cjs');
 require('../../chunk-RPTRTGC2.cjs');
-require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-OHIB3TEN.cjs');
 
 

package/dist/ui/waterfall/TimelineEvent.mjs

@@ -1,6 +1,7 @@
 export { TimelineEvent } from '../../chunk-N6DSPSMM.mjs';
 import '../../chunk-4U232QAX.mjs';
 import '../../chunk-F7ZHPSLA.mjs';
+import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-3QT5VABC.mjs';
 import '../../chunk-XHJDRQD7.mjs';
 import '../../chunk-LQOPO4KU.mjs';
@@ -8,5 +9,4 @@ import '../../chunk-U3LN5NB6.mjs';
 import '../../chunk-IZARTVYN.mjs';
 import '../../chunk-VA4LUFKD.mjs';
 import '../../chunk-4F2GSF2T.mjs';
-import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-HMN4IKTG.mjs';

package/dist/ui/waterfall/TimelineProcessBar.cjs

@@ -3,6 +3,7 @@
 var chunkYXFHJKNW_cjs = require('../../chunk-YXFHJKNW.cjs');
 require('../../chunk-G2ZYONQO.cjs');
 require('../../chunk-QN4N4I3Z.cjs');
+require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-Q7E73DVJ.cjs');
 require('../../chunk-JR4TVE43.cjs');
 require('../../chunk-VXZURKMQ.cjs');
@@ -10,7 +11,6 @@ require('../../chunk-Q4XH2Z5M.cjs');
 require('../../chunk-6BOWMGFG.cjs');
 require('../../chunk-YZIR6LIY.cjs');
 require('../../chunk-RPTRTGC2.cjs');
-require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-OHIB3TEN.cjs');
 
 

package/dist/ui/waterfall/TimelineProcessBar.mjs

@@ -1,6 +1,7 @@
 export { TimelineProcessBar } from '../../chunk-CO6EASQO.mjs';
 import '../../chunk-4U232QAX.mjs';
 import '../../chunk-F7ZHPSLA.mjs';
+import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-3QT5VABC.mjs';
 import '../../chunk-XHJDRQD7.mjs';
 import '../../chunk-LQOPO4KU.mjs';
@@ -8,5 +9,4 @@ import '../../chunk-U3LN5NB6.mjs';
 import '../../chunk-IZARTVYN.mjs';
 import '../../chunk-VA4LUFKD.mjs';
 import '../../chunk-4F2GSF2T.mjs';
-import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-HMN4IKTG.mjs';

package/dist/ui/waterfall/Wedges.cjs

@@ -2,6 +2,7 @@
 
 var chunk5MNZYCN2_cjs = require('../../chunk-5MNZYCN2.cjs');
 require('../../chunk-QN4N4I3Z.cjs');
+require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-Q7E73DVJ.cjs');
 require('../../chunk-JR4TVE43.cjs');
 require('../../chunk-VXZURKMQ.cjs');
@@ -9,7 +10,6 @@ require('../../chunk-Q4XH2Z5M.cjs');
 require('../../chunk-6BOWMGFG.cjs');
 require('../../chunk-YZIR6LIY.cjs');
 require('../../chunk-RPTRTGC2.cjs');
-require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-OHIB3TEN.cjs');
 
 

package/dist/ui/waterfall/Wedges.mjs

@@ -1,5 +1,6 @@
 export { LeftWedge, RightWedge } from '../../chunk-IR334P7F.mjs';
 import '../../chunk-F7ZHPSLA.mjs';
+import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-3QT5VABC.mjs';
 import '../../chunk-XHJDRQD7.mjs';
 import '../../chunk-LQOPO4KU.mjs';
@@ -7,5 +8,4 @@ import '../../chunk-U3LN5NB6.mjs';
 import '../../chunk-IZARTVYN.mjs';
 import '../../chunk-VA4LUFKD.mjs';
 import '../../chunk-4F2GSF2T.mjs';
-import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-HMN4IKTG.mjs';

package/dist/ui/waterfall/index.cjs

@@ -1,28 +1,29 @@
 'use strict';
 
-var chunk7RHQ6DVU_cjs = require('../../chunk-7RHQ6DVU.cjs');
+var chunkCGBEPOL4_cjs = require('../../chunk-CGBEPOL4.cjs');
 require('../../chunk-WJL5HMO6.cjs');
 require('../../chunk-RJ7I6ZQK.cjs');
-require('../../chunk-YXFHJKNW.cjs');
 require('../../chunk-5MNZYCN2.cjs');
 require('../../chunk-Z6UDRPC2.cjs');
 require('../../chunk-YJ6X6T5K.cjs');
 require('../../chunk-G5NT42YF.cjs');
-require('../../chunk-EEGQLTSQ.cjs');
 require('../../chunk-VOTZLQ6J.cjs');
 require('../../chunk-2J75MYQA.cjs');
 require('../../chunk-UTS56UA5.cjs');
 require('../../chunk-JWVH6R35.cjs');
 require('../../chunk-MVAFOQ67.cjs');
 require('../../chunk-TUYG6BYZ.cjs');
+require('../../chunk-YXFHJKNW.cjs');
 var chunkG2ZYONQO_cjs = require('../../chunk-G2ZYONQO.cjs');
-require('../../chunk-5JPYU5A6.cjs');
+require('../../chunk-LV4XJY75.cjs');
 require('../../chunk-HAVTMZR3.cjs');
-require('../../chunk-LFSCJLL2.cjs');
-require('../../chunk-LQGXG373.cjs');
+require('../../chunk-EEGQLTSQ.cjs');
+require('../../chunk-BDAKLXXX.cjs');
+require('../../chunk-WB43VEZA.cjs');
 require('../../chunk-JMCH2AFN.cjs');
 require('../../chunk-G5JZGNKY.cjs');
 require('../../chunk-QN4N4I3Z.cjs');
+require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-Q7E73DVJ.cjs');
 require('../../chunk-JR4TVE43.cjs');
 require('../../chunk-VXZURKMQ.cjs');
@@ -30,7 +31,6 @@ require('../../chunk-Q4XH2Z5M.cjs');
 require('../../chunk-6BOWMGFG.cjs');
 require('../../chunk-YZIR6LIY.cjs');
 require('../../chunk-RPTRTGC2.cjs');
-require('../../chunk-LBWMTA5T.cjs');
 require('../../chunk-OHIB3TEN.cjs');
 require('../../chunk-G4FJGNY5.cjs');
 
@@ -38,7 +38,7 @@ require('../../chunk-G4FJGNY5.cjs');
 
 Object.defineProperty(exports, "Waterfall", {
   enumerable: true,
-  get: function () { return chunk7RHQ6DVU_cjs.Waterfall; }
+  get: function () { return chunkCGBEPOL4_cjs.Waterfall; }
 });
 Object.defineProperty(exports, "TOTAL_DURATION", {
   enumerable: true,

package/dist/ui/waterfall/index.mjs

@@ -1,26 +1,27 @@
-export { Waterfall } from '../../chunk-K2OC2HWQ.mjs';
+export { Waterfall } from '../../chunk-RFRBGVBZ.mjs';
 import '../../chunk-JWKOW2OV.mjs';
 import '../../chunk-VPQ5SSY3.mjs';
-import '../../chunk-CO6EASQO.mjs';
 import '../../chunk-IR334P7F.mjs';
 import '../../chunk-CIPI2V54.mjs';
 import '../../chunk-WPDU2YYR.mjs';
 import '../../chunk-HVVT3D2T.mjs';
-import '../../chunk-PC5DHSC4.mjs';
 import '../../chunk-HTAFERCZ.mjs';
 import '../../chunk-SA5WKLYB.mjs';
 import '../../chunk-D5H4XX6Q.mjs';
 import '../../chunk-JVV7W3TP.mjs';
 import '../../chunk-OC4HRPZU.mjs';
 import '../../chunk-N6DSPSMM.mjs';
+import '../../chunk-CO6EASQO.mjs';
 export { TOTAL_DURATION, borderColorClasses, colorClasses, formatDuration, leftWedgeClasses, rightWedgeClasses } from '../../chunk-4U232QAX.mjs';
-import '../../chunk-SUEFWFPX.mjs';
+import '../../chunk-HFGRTWTD.mjs';
 import '../../chunk-VQPJ7TLB.mjs';
-import '../../chunk-5MBEK77I.mjs';
-import '../../chunk-LRSDE62T.mjs';
+import '../../chunk-PC5DHSC4.mjs';
+import '../../chunk-57MAUYQZ.mjs';
+import '../../chunk-XMQULAAU.mjs';
 import '../../chunk-BNDRHLLZ.mjs';
 import '../../chunk-PDOFOJ4P.mjs';
 import '../../chunk-F7ZHPSLA.mjs';
+import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-3QT5VABC.mjs';
 import '../../chunk-XHJDRQD7.mjs';
 import '../../chunk-LQOPO4KU.mjs';
@@ -28,6 +29,5 @@ import '../../chunk-U3LN5NB6.mjs';
 import '../../chunk-IZARTVYN.mjs';
 import '../../chunk-VA4LUFKD.mjs';
 import '../../chunk-4F2GSF2T.mjs';
-import '../../chunk-IDUVYPN7.mjs';
 import '../../chunk-HMN4IKTG.mjs';
 import '../../chunk-SAGQV2YZ.mjs';

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vuer-ai/vuer-uikit",
   "author": "Ge Yang",
-  "version": "0.0.109",
+  "version": "0.0.113",
   "files": [
     "/dist",
     "/src"
@@ -52,9 +52,9 @@
     "./styles/variables.css": "./dist/styles/variables.css"
   },
   "peerDependencies": {
-    "better-auth": "^1.3.9",
     "@react-three/drei": "latest",
     "@react-three/fiber": "latest",
+    "better-auth": "^1.3.9",
     "lucide-react": "latest",
     "react": "latest",
     "react-dom": "latest",
@@ -71,6 +71,7 @@
     "@radix-ui/react-dropdown-menu": "^2.1.5",
     "@radix-ui/react-label": "^2.1.7",
     "@radix-ui/react-popover": "^1.1.4",
+    "@radix-ui/react-progress": "^1.1.7",
     "@radix-ui/react-radio-group": "^1.3.7",
     "@radix-ui/react-select": "^2.2.5",
     "@radix-ui/react-separator": "^1.1.7",
@@ -106,7 +107,7 @@
     "eslint-plugin-react-refresh": "^0.4.20",
     "globals": "^16.3.0",
     "husky": "^9.1.7",
-    "lint-staged": "^16.1.2",
+    "lint-staged": "^16.1.6",
     "postcss": "^8.5.6",
     "postcss-cli": "^11.0.1",
     "postcss-import": "^16.1.1",
@@ -126,7 +127,7 @@
   ],
   "license": "MIT",
   "lint-staged": {
-    "*.{js,ts,jsx,tsx}": "eslint . --fix"
+    "*.{js,ts,jsx,tsx}": "eslint --fix"
   },
   "scripts": {
     "dev": "tsup --watch",

package/src/auth/components/index.ts

@@ -0,0 +1 @@
+export * from "./user-avatar"

package/src/auth/components/user-avatar/index.tsx

@@ -0,0 +1,94 @@
+import { LoaderCircle, Plus } from "lucide-react";
+import { Fragment } from "react";
+
+import {
+  Avatar,
+  AvatarFallback,
+  AvatarImage,
+  Button,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from "../../../ui";
+import { useSignIn } from "../../hooks/use-sign-in";
+import { useUser } from "../../hooks/use-user";
+import { useVuerSessions } from "../../hooks/use-vuer-sessions";
+
+interface Props {
+  className?: string;
+}
+
+export function UserAvatar({ className }: Props) {
+  const { data: session, isPending: authLoading } = useUser();
+
+  const { signIn } = useSignIn();
+
+  const { sessions, isPending: sessionsLoading } = useVuerSessions();
+
+  const user = session?.user;
+
+  console.log("user", user);
+
+  if (authLoading || sessionsLoading) {
+    return (
+      <Avatar className="size-8 items-center justify-center">
+        <LoaderCircle className="animate-spin" />
+      </Avatar>
+    );
+  }
+
+  if (!user) {
+    return <Button onClick={() => signIn()}>Sign in</Button>;
+  }
+
+  return (
+    <DropdownMenu>
+      <DropdownMenuTrigger>
+        <Avatar key={user.id} className={className}>
+          {user.image && <AvatarImage src={user.image} alt={user.name} />}
+          <AvatarFallback>{user.name.charAt(0)}</AvatarFallback>
+        </Avatar>
+      </DropdownMenuTrigger>
+
+      <DropdownMenuContent>
+        <DropdownMenuLabel className="flex items-center gap-2">
+          <Avatar className="size-8" key={user.id}>
+            {user.image && <AvatarImage src={user.image} alt={user.name} />}
+            <AvatarFallback>{user.name.charAt(0)}</AvatarFallback>
+          </Avatar>
+
+          <p>{user.name}</p>
+        </DropdownMenuLabel>
+
+        <DropdownMenuItem>
+          <Plus /> Add User
+        </DropdownMenuItem>
+
+        {sessions.map((session) => {
+          const current = session.user;
+          return (
+            <Fragment key={current.id}>
+              {current.id !== user.id ? (
+                <DropdownMenuItem>
+                  <Avatar key={user.id}>
+                    {current.image && <AvatarImage src={current.image} alt={current.name} />}
+                    <AvatarFallback>{current.name.charAt(0)}</AvatarFallback>
+                  </Avatar>
+
+                  <p>{current.name}</p>
+                </DropdownMenuItem>
+              ) : null}
+            </Fragment>
+          );
+        })}
+
+        <DropdownMenuSeparator />
+
+        <DropdownMenuItem>Sign Out</DropdownMenuItem>
+      </DropdownMenuContent>
+    </DropdownMenu>
+  );
+}

package/src/auth/context/{auth-context.ts → user-context.ts}

@@ -2,14 +2,14 @@ import { createContext } from "react";
 
 import { Refetch, UserSession } from "../types";
 
-interface IAuthContext {
+interface IUserContext {
   baseURL: string;
   data: UserSession | null;
   isPending: boolean;
   refetch: Refetch;
 }
 
-const AuthContext = createContext<IAuthContext>(null!);
+const UserContext = createContext<IUserContext>(null!);
 
-export { AuthContext };
-export type { IAuthContext };
+export { UserContext };
+export type { IUserContext };

package/src/auth/handler/fetch-auth.ts

@@ -0,0 +1,10 @@
+import { bearerToken } from "../localstorage-key";
+
+export const fetchAuth = async (url: string, options: RequestInit = {}) => {
+  const token = localStorage.getItem(bearerToken) || "";
+  const headers: HeadersInit = {
+    ...options.headers,
+    Authorization: `Bearer ${token}`,
+  };
+  return fetch(url, { ...options, headers });
+};

package/src/auth/handler/fetch-server.ts

@@ -0,0 +1,10 @@
+import { JWTToken } from "../localstorage-key";
+
+export const fetchServer = async (url: string, options: RequestInit = {}) => {
+  const token = localStorage.getItem(JWTToken) || "";
+  const headers: HeadersInit = {
+    ...options.headers,
+    Authorization: `Bearer ${token}`,
+  };
+  return fetch(url, { ...options, headers });
+};

package/src/auth/handler/get-session.ts

@@ -1,17 +1,19 @@
-import { bearerToken } from "../localstorage-key";
+import { JWTToken } from "../localstorage-key";
 import { UserSession } from "../types";
+import { fetchAuth } from "./fetch-auth";
 
 const getSession = async (baseURL: string) => {
-  const token = localStorage.getItem(bearerToken) || "";
-  const res = await fetch(`${baseURL}/api/auth/get-session`, {
-    headers: {
-      Authorization: `Bearer ${token}`,
-    },
-    credentials: "include",
-  });
+  const res = await fetchAuth(`${baseURL}/api/auth/get-session`, { credentials: "include" });
   const authJWT = res.headers.get("set-auth-jwt");
+
+  localStorage.setItem(JWTToken, authJWT ?? "");
+
   const data = (await res.json()) as UserSession;
-  return { ...data, session: { ...data.session, jwt: authJWT ?? "" } };
+  if (data) {
+    return { ...data, session: { ...data.session, jwt: authJWT ?? "" } };
+  } else {
+    return null;
+  }
 };
 
 export { getSession };

package/src/auth/handler/get-sessions.ts

@@ -0,0 +1,16 @@
+import { UserSession } from "../types";
+import { fetchAuth } from "./fetch-auth";
+
+const getSessions = async (baseURL: string) => {
+  const res = await fetchAuth(`${baseURL}/api/auth/multi-session/list-device-sessions`, {
+    credentials: "include",
+  });
+  const authJWT = res.headers.get("set-auth-jwt");
+  const data = (await res.json()) as UserSession[];
+
+  return data.map((session) => {
+    return { ...session, session: { ...session.session, jwt: authJWT ?? "" } };
+  });
+};
+
+export { getSessions };

package/src/auth/handler/sign-in-handler.ts

@@ -1,17 +1,23 @@
 import { bearerToken } from "../localstorage-key";
-import { Refetch, SignInParams, SignInWithPopup, SignInWithRedirect } from "../types";
+import { SignInParams, SignInWithPopup, SignInWithRedirect } from "../types";
 
-const signInHandler = (props: SignInParams, refetch: Refetch): Promise<string> | void => {
+const signInHandler = (props: SignInParams): Promise<string> | void => {
   const { authMode } = props;
 
   if (authMode === "redirect") {
     return sigInWithRedirect(props);
   } else {
-    return sigInWithPopup(props, refetch);
+    return sigInWithPopup(props);
   }
 };
 
-const sigInWithPopup = async (props: SignInWithPopup, refetch: Refetch): Promise<string> => {
+const sigInWithRedirect = (props: SignInWithRedirect) => {
+  const { callbackURL, baseURL } = props;
+
+  window.location.href = `${baseURL}/authorize?callbackURL=${encodeURIComponent(callbackURL)}`;
+};
+
+const sigInWithPopup = async (props: SignInWithPopup): Promise<string> => {
   const { callbackURL, baseURL } = props;
 
   const width = 500;
@@ -47,7 +53,6 @@ const sigInWithPopup = async (props: SignInWithPopup, refetch: Refetch): Promise
           if (callbackURL) {
             window.location.href = callbackURL;
           }
-          refetch();
         }
       }
     };
@@ -56,10 +61,4 @@ const sigInWithPopup = async (props: SignInWithPopup, refetch: Refetch): Promise
   });
 };
 
-const sigInWithRedirect = (props: SignInWithRedirect) => {
-  const { callbackURL, baseURL } = props;
-
-  window.location.href = `${baseURL}/authorize?callbackURL=${encodeURIComponent(callbackURL)}`;
-};
-
 export { signInHandler };

package/src/auth/handler/sign-out-handler.ts

@@ -1,12 +1,8 @@
-import { bearerToken } from "../localstorage-key";
+import { fetchAuth } from "./fetch-auth";
 
 export const signOutHandler = async (baseURL: string) => {
-  const token = localStorage.getItem(bearerToken) || "";
-  const res = await fetch(`${baseURL}/api/auth/sign-out`, {
+  const res = await fetchAuth(`${baseURL}/api/auth/sign-out`, {
     method: "POST",
-    headers: {
-      Authorization: `Bearer ${token}`,
-    },
     credentials: "include",
   });
   return (await res.json()) as { success: boolean };

package/src/auth/hooks/use-sign-in.ts

@@ -0,0 +1,33 @@
+import { useCallback, useMemo, useState } from "react";
+
+import { signInHandler } from "../handler/sign-in-handler";
+import { SignInWithOutBaseURLParams } from "../types";
+import { useUser } from "./use-user";
+
+const useSignIn = () => {
+  const { refetch, baseURL } = useUser();
+
+  const [isPending, setIsPending] = useState(false);
+
+  const signInHandle = useCallback(
+    async (props?: SignInWithOutBaseURLParams) => {
+      try {
+        setIsPending(true);
+        await signInHandler({ ...props, baseURL });
+        const result = await refetch();
+        setIsPending(false);
+        return result;
+      } catch (e) {
+        console.error(e);
+        return null;
+      }
+    },
+    [baseURL, refetch],
+  );
+
+  return useMemo(() => {
+    return { isPending, signIn: signInHandle };
+  }, [isPending, signInHandle]);
+};
+
+export { useSignIn };

package/src/auth/hooks/use-sign-out.ts

@@ -0,0 +1,30 @@
+import { useCallback, useMemo, useState } from "react";
+
+import { useUser } from "./use-user";
+import { signOutHandler } from "../handler/sign-out-handler";
+
+const useSignOut = () => {
+  const { refetch, baseURL } = useUser();
+
+  const [isPending, setIsPending] = useState(false);
+
+  const signOutHandle = useCallback(async () => {
+    try {
+      setIsPending(true);
+      await signOutHandler(baseURL);
+      await refetch();
+      setIsPending(false);
+    } catch (e) {
+      console.error(e);
+    }
+  }, [baseURL, refetch]);
+
+  return useMemo(() => {
+    return {
+      isPending,
+      signOut: signOutHandle,
+    };
+  }, [isPending, signOutHandle]);
+};
+
+export { useSignOut };

package/src/auth/hooks/{use-vuer-auth.ts → use-user.ts}

@@ -1,9 +1,9 @@
 import { useContext } from "react";
 
-import { IAuthContext, AuthContext } from "../context/auth-context";
+import { IUserContext, UserContext } from "../context/user-context";
 
-export const useVuerAuth = (): IAuthContext => {
-  const context = useContext(AuthContext);
+export const useUser = (): IUserContext => {
+  const context = useContext(UserContext);
 
   if (context === undefined) throw new Error("useSession must be used within a SessionContext");
   return context;

package/src/auth/hooks/use-vuer-sessions.ts

@@ -0,0 +1,29 @@
+import { useEffect, useMemo, useState } from "react";
+
+import { useUser } from "./use-user";
+import { getSessions } from "../handler/get-sessions";
+import { UserSession } from "../types";
+
+export const useVuerSessions = () => {
+  const { baseURL } = useUser();
+
+  const [isPending, setIsPending] = useState(true);
+  const [sessions, setSessions] = useState<UserSession[]>([]);
+
+  useEffect(() => {
+    setIsPending(true);
+    getSessions(baseURL)
+      .then((sessions) => {
+        console.log("sessions", sessions);
+        setSessions(sessions);
+        setIsPending(false);
+      })
+      .catch(() => {
+        setIsPending(false);
+      });
+  }, [baseURL]);
+
+  return useMemo(() => {
+    return { isPending, sessions };
+  }, [isPending, sessions]);
+};

package/src/auth/index.ts

@@ -1,6 +1,12 @@
-export * from "./hooks/use-vuer-method";
-export * from "./hooks/use-vuer-auth";
+export * from "./hooks/use-user";
+export * from "./hooks/use-sign-in";
+export * from "./hooks/use-sign-out";
 
 export * from "./localstorage-key";
 
-export { VuerAuthProvider } from "./vuer-auth-provider";
+export * from "./components";
+
+export { fetchServer } from "./handler/fetch-server";
+export { fetchAuth } from "./handler/fetch-auth";
+
+export { VuerUserProvider } from "./vuer-user-provider";