@rebasepro/auth 0.0.1-canary.eae7889 → 0.0.1-canary.f81da60

package/dist/api.d.ts

@@ -20,9 +20,9 @@ export declare function register(email: string, password: string, displayName?:
  */
 export declare function login(email: string, password: string): Promise<AuthResponse>;
 /**
- * Login with Google ID token
+ * Login with Google token (ID token or access token)
  */
-export declare function googleLogin(idToken: string): Promise<AuthResponse>;
+export declare function googleLogin(token: string, tokenType?: "idToken" | "accessToken"): Promise<AuthResponse>;
 /**
  * Login with LinkedIn OAuth code
  */

package/dist/index.es.js

@@ -1,6 +1,6 @@
 import { useState, useRef, useEffect, useCallback, useLayoutEffect } from "react";
 import { jsxs, jsx, Fragment } from "react/jsx-runtime";
-import { Menu, MenuItem, iconSize, IconButton, Typography, cls, TextField, LoadingButton, Button, CenteredView, CircularProgress, Container, Table, TableHeader, TableCell, TableBody, TableRow, Tooltip, Checkbox, getColorSchemeForSeed, Chip, Dialog, DialogTitle, DialogContent, DialogActions, MultiSelect, MultiSelectItem } from "@rebasepro/ui";
+import { Menu, MenuItem, iconSize, IconButton, Button, cls, Typography, TextField, LoadingButton, CenteredView, CircularProgress, Container, Table, TableHeader, TableCell, TableBody, TableRow, Tooltip, Checkbox, getColorSchemeForSeed, Chip, Dialog, DialogTitle, DialogContent, DialogActions, MultiSelect, MultiSelectItem } from "@rebasepro/ui";
 import { MoonIcon, SunIcon, SunMoonIcon, MailIcon, ArrowLeftIcon, PlusIcon, Trash2Icon } from "lucide-react";
 import { useModeController, useTranslation, LanguageToggle, ErrorView, RebaseLogo, useRebaseRegistryDispatch, useSnackbarController, ConfirmationDialog, useAuthController } from "@rebasepro/core";
 let baseApiUrl = "";
@@ -72,11 +72,11 @@ async function login(email, password) {
   });
   return handleResponse(response);
 }
-async function googleLogin(idToken) {
+async function googleLogin(token, tokenType = "idToken") {
   const response = await fetchWithHandling(`${baseApiUrl}/api/auth/google`, {
     method: "POST",
     headers: { "Content-Type": "application/json" },
-    body: JSON.stringify({ idToken })
+    body: JSON.stringify({ [tokenType]: token })
   });
   return handleResponse(response);
 }
@@ -456,11 +456,11 @@ function useRebaseAuthController(props = {}) {
       setAuthLoading(false);
     }
   }, [handleAuthSuccess]);
-  const googleLogin$1 = useCallback(async (idToken) => {
+  const googleLogin$1 = useCallback(async (token, tokenType = "idToken") => {
     setAuthLoading(true);
     setAuthProviderError(null);
     try {
-      const response = await googleLogin(idToken);
+      const response = await googleLogin(token, tokenType);
       await handleAuthSuccess(response.user, response.tokens);
     } catch (error) {
       setAuthProviderError(error);
@@ -1115,7 +1115,7 @@ function RebaseLoginView({
     "div",
     {
       className: cls(
-        "relative flex items-center justify-center h-screen w-screen p-4 transition-opacity duration-500 bg-white dark:bg-surface-950",
+        "relative flex items-center justify-center h-screen w-screen p-4 transition-opacity duration-500 bg-white dark:bg-surface-900",
         fadeIn ? "opacity-100" : "opacity-0"
       ),
       children: [
@@ -1193,22 +1193,17 @@ function RebaseLoginView({
                     authController
                   }
                 ),
-                showRegistration && /* @__PURE__ */ jsx("div", { className: "mt-2 text-center", children: /* @__PURE__ */ jsxs(Typography, { variant: "body2", color: "secondary", children: [
-                  "Don't have an account?",
-                  " ",
-                  /* @__PURE__ */ jsx(
-                    "button",
-                    {
-                      type: "button",
-                      className: cls(
-                        "font-semibold hover:underline cursor-pointer",
-                        "text-primary-600 dark:text-primary-400"
-                      ),
-                      onClick: () => switchMode("register"),
-                      children: "Create one"
-                    }
-                  )
-                ] }) })
+                showRegistration && /* @__PURE__ */ jsx(
+                  Button,
+                  {
+                    className: "w-full",
+                    variant: "filled",
+                    color: "primary",
+                    size: "large",
+                    onClick: () => switchMode("register"),
+                    children: "Create an account"
+                  }
+                )
               ] }),
               mode === "login" && /* @__PURE__ */ jsx(
                 LoginForm,
@@ -1269,74 +1264,75 @@ function LoginButton({
     }
   );
 }
+const GoogleIcon = () => /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", width: "20", height: "20", children: [
+  /* @__PURE__ */ jsx(
+    "path",
+    {
+      fill: "#4285F4",
+      d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
+    }
+  ),
+  /* @__PURE__ */ jsx(
+    "path",
+    {
+      fill: "#34A853",
+      d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
+    }
+  ),
+  /* @__PURE__ */ jsx(
+    "path",
+    {
+      fill: "#FBBC05",
+      d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
+    }
+  ),
+  /* @__PURE__ */ jsx(
+    "path",
+    {
+      fill: "#EA4335",
+      d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
+    }
+  )
+] });
 function GoogleLoginButton({
   disabled,
   googleClientId,
   authController
 }) {
-  const handleGoogleLogin = async () => {
-    try {
-      const google = window.google;
-      if (!google) {
-        console.error("Google Sign-In not loaded");
-        return;
-      }
-      google.accounts.id.initialize({
-        client_id: googleClientId,
-        callback: async (response) => {
-          try {
-            await authController.googleLogin(response.credential);
-          } catch (err) {
-            console.error("Google login error:", err);
-          }
+  const tokenClientRef = useRef(null);
+  useEffect(() => {
+    const google = window.google;
+    if (!google || tokenClientRef.current) return;
+    tokenClientRef.current = google.accounts.oauth2.initTokenClient({
+      client_id: googleClientId,
+      scope: "openid email profile",
+      callback: async (response) => {
+        if (response.error || !response.access_token) {
+          console.error("Google login error:", response.error);
+          return;
         }
-      });
-      google.accounts.id.prompt();
-    } catch (err) {
-      console.error("Google login error:", err);
+        try {
+          await authController.googleLogin(response.access_token, "accessToken");
+        } catch (err) {
+          console.error("Google login error:", err);
+        }
+      }
+    });
+  }, [googleClientId, authController]);
+  const handleClick = () => {
+    if (!tokenClientRef.current) {
+      console.error("Google Sign-In not loaded");
+      return;
     }
+    tokenClientRef.current.requestAccessToken();
   };
   return /* @__PURE__ */ jsx(
-    Button,
+    LoginButton,
     {
       disabled,
-      className: "w-full",
-      variant: "outlined",
-      size: "large",
-      onClick: handleGoogleLogin,
-      children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center w-full gap-3 py-1", children: [
-        /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", width: "20", height: "20", children: [
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              fill: "#4285F4",
-              d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              fill: "#34A853",
-              d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              fill: "#FBBC05",
-              d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z"
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "path",
-            {
-              fill: "#EA4335",
-              d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z"
-            }
-          )
-        ] }),
-        /* @__PURE__ */ jsx(Typography, { variant: "button", children: "Continue with Google" })
-      ] })
+      text: "Sign in with Google",
+      icon: /* @__PURE__ */ jsx(GoogleIcon, {}),
+      onClick: handleClick
     }
   );
 }
@@ -1457,6 +1453,7 @@ function LoginForm({
       {
         type: "submit",
         variant: "filled",
+        color: "primary",
         className: "w-full mt-1",
         size: "large",
         loading: authController.authLoading,
@@ -1578,6 +1575,7 @@ function ForgotPasswordForm({
       {
         type: "submit",
         variant: "filled",
+        color: "primary",
         className: "w-full",
         size: "large",
         loading: authController.authLoading,
@@ -1633,6 +1631,7 @@ function RoleChip({ role }) {
 }
 function UsersView({ userManagement, apiUrl, getAuthToken }) {
   const { users, roles, saveUser, deleteUser, loading } = userManagement;
+  const usersError = "usersError" in userManagement ? userManagement.usersError : void 0;
   const snackbarController = useSnackbarController();
   const { user: loggedInUser } = useAuthController();
   const [dialogOpen, setDialogOpen] = useState(false);
@@ -1709,7 +1708,7 @@ function UsersView({ userManagement, apiUrl, getAuthToken }) {
     return /* @__PURE__ */ jsx(CenteredView, { children: /* @__PURE__ */ jsx(CircularProgress, {}) });
   }
   return /* @__PURE__ */ jsxs(Container, { className: "w-full flex flex-col py-4 gap-4", maxWidth: "6xl", children: [
-    !hasAdmin && loggedInUser && /* @__PURE__ */ jsxs("div", { className: "bg-yellow-100 dark:bg-yellow-900 border border-yellow-400 dark:border-yellow-700 rounded p-4 flex items-center justify-between", children: [
+    !hasAdmin && !usersError && loggedInUser && /* @__PURE__ */ jsxs("div", { className: "bg-yellow-100 dark:bg-yellow-900 border border-yellow-400 dark:border-yellow-700 rounded p-4 flex items-center justify-between", children: [
       /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Typography, { variant: "label", className: "text-yellow-800 dark:text-yellow-200", children: "No admin users exist. You can make yourself an admin." }) }),
       /* @__PURE__ */ jsx(
         Button,
@@ -1752,7 +1751,10 @@ function UsersView({ userManagement, apiUrl, getAuthToken }) {
             return role ? /* @__PURE__ */ jsx(RoleChip, { role }, roleId) : /* @__PURE__ */ jsx("span", { children: roleId }, roleId);
           }) }) })
         ] }, user.uid)),
-        users.length === 0 && /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colspan: 4, children: /* @__PURE__ */ jsx(CenteredView, { className: "flex flex-col gap-4 my-8 items-center", children: /* @__PURE__ */ jsx(Typography, { variant: "label", children: "There are no users yet" }) }) }) })
+        users.length === 0 && /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colspan: 4, children: /* @__PURE__ */ jsxs(CenteredView, { className: "flex flex-col gap-4 my-8 items-center", children: [
+          /* @__PURE__ */ jsx(Typography, { variant: "label", children: usersError ? "You don't have permission to view users" : "There are no users yet" }),
+          usersError && /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-surface-500", children: "Contact an administrator if you need access to this section." })
+        ] }) }) })
       ] })
     ] }) }),
     /* @__PURE__ */ jsx(
@@ -1909,6 +1911,7 @@ function UserDetailsForm({
 }
 function RolesView({ userManagement, collections = [] }) {
   const { roles, saveRole, deleteRole, loading, allowDefaultRolesCreation } = userManagement;
+  const rolesError = "rolesError" in userManagement ? userManagement.rolesError : void 0;
   const snackbarController = useSnackbarController();
   const [dialogOpen, setDialogOpen] = useState(false);
   const [selectedRole, setSelectedRole] = useState();
@@ -2001,8 +2004,9 @@ function RolesView({ userManagement, collections = [] }) {
           ] }, role.id);
         }),
         roles.length === 0 && /* @__PURE__ */ jsx(TableRow, { children: /* @__PURE__ */ jsx(TableCell, { colspan: 4, children: /* @__PURE__ */ jsxs(CenteredView, { className: "flex flex-col gap-4 my-8 items-center", children: [
-          /* @__PURE__ */ jsx(Typography, { variant: "label", children: "You don't have any roles yet." }),
-          allowDefaultRolesCreation && /* @__PURE__ */ jsx(Button, { onClick: createDefaultRoles, children: "Create default roles" })
+          /* @__PURE__ */ jsx(Typography, { variant: "label", children: rolesError ? "You don't have permission to view roles" : "You don't have any roles yet." }),
+          rolesError && /* @__PURE__ */ jsx(Typography, { variant: "caption", className: "text-surface-500", children: "Contact an administrator if you need access to this section." }),
+          !rolesError && allowDefaultRolesCreation && /* @__PURE__ */ jsx(Button, { onClick: createDefaultRoles, children: "Create default roles" })
         ] }) }) })
       ] })
     ] }) }),