feat: implement ActiveSessions component and JWT session tracking to manage user device access

libs/api/src/lib/query-and-mutation/index.ts

@@ -26,7 +26,7 @@ const queryApi = baseApi.injectEndpoints({
   overrideExisting: false,
 });
 
-export const { useApiQueryQuery, useApiMutationMutation } = queryApi;
+export const { useApiQueryQuery, useLazyApiQueryQuery, useApiMutationMutation } = queryApi;
 
 export function useApiQuery<TData = unknown>(
   args: ApiQueryArgs,
@@ -37,6 +37,17 @@ export function useApiQuery<TData = unknown>(
   };
 }
 
+/**
+ * Same endpoint as `useApiQuery`, fetched on demand instead of on render — for
+ * the case where the arguments are only known at click time.
+ */
+export function useApiLazyQuery<TData = unknown>(): [
+  (args: ApiQueryArgs) => { unwrap: () => Promise<TData> },
+] {
+  const [trigger] = useLazyApiQueryQuery();
+  return [trigger as unknown as (args: ApiQueryArgs) => { unwrap: () => Promise<TData> }];
+}
+
 type UseApiMutationResult<TData> = {
   data: TData | undefined;
   isLoading: boolean;