@rebasepro/admin 0.1.2 → 0.2.1

package/src/components/admin/UsersView.tsx

@@ -3,11 +3,47 @@ import React, { useState, useEffect, useCallback, useRef } from "react";
 import { User } from "@rebasepro/types";
 import { useSnackbarController, useAuthController, useTranslation } from "@rebasepro/core";
 import { useBreadcrumbsController } from "../../index";
-import { Button, Container, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Table, TableBody, TableCell, TableHeader, TableRow, TextField, Typography, CircularProgress, CenteredView, Tooltip, MultiSelect, MultiSelectItem, LoadingButton, SearchBar, Select, SelectItem, Skeleton , iconSize } from "@rebasepro/ui";
-import { MailIcon, KeyRoundIcon, PlusIcon, Trash2Icon, CopyIcon, CheckCircleIcon, ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
+import {
+    Alert,
+    Button,
+    CenteredView,
+    CheckCircleIcon,
+    ChevronLeftIcon,
+    ChevronRightIcon,
+    CircularProgress,
+    Container,
+    CopyIcon,
+    Dialog,
+    DialogActions,
+    DialogContent,
+    DialogTitle,
+    IconButton,
+    iconSize,
+    KeyRoundIcon,
+    LoadingButton,
+    MailIcon,
+    MultiSelect,
+    MultiSelectItem,
+    PlusIcon,
+    SearchBar,
+    Select,
+    SelectItem,
+    Skeleton,
+    Table,
+    TableBody,
+    TableCell,
+    TableHeader,
+    TableRow,
+    TextField,
+    Tooltip,
+    Trash2Icon,
+    Typography
+} from "@rebasepro/ui";
 import { RoleChip } from "./RoleChip";
 import { UserManagementDelegate, Role, UserCreationResult } from "@rebasepro/types";
 import { ConfirmationDialog, BootstrapAdminBanner } from "@rebasepro/core";
+import { CreationResultDialog } from "./CreationResultDialog";
+
 
 const PAGE_SIZE = 25;
 
@@ -105,11 +141,11 @@ message: error instanceof Error ? error.message : "Failed to load users" });
 
     // Load initial page when delegate finishes loading — runs exactly once.
     useEffect(() => {
-        if (!delegateLoading && hasServerSearch && !initialFetchDone.current) {
+        if (!delegateLoading && !usersError && hasServerSearch && !initialFetchDone.current) {
             initialFetchDone.current = true;
             fetchPageRef.current(0, "", roleFilter, true);
         }
-    }, [delegateLoading, hasServerSearch, roleFilter]);
+    }, [delegateLoading, usersError, hasServerSearch, roleFilter]);
 
     // Handle search changes (debounced)
     const handleSearch = useCallback((value: string) => {
@@ -377,7 +413,7 @@ roles: ["w-16", "w-16"] }
 
                         {displayUsers.length === 0 && !tableLoading && !delegateLoading && (
                             <TableRow>
-                                <TableCell colspan={5}>
+                                <TableCell colspan={6}>
                                     <CenteredView className="flex flex-col gap-4 my-8 items-center">
                                         <Typography variant="label">
                                             {usersError
@@ -469,125 +505,6 @@ roles: ["w-16", "w-16"] }
     );
 }
 
-// ============================================
-// CreationResultDialog Component
-// ============================================
-function CreationResultDialog({
-    result,
-    onClose
-}: {
-    result: UserCreationResult;
-    onClose: () => void;
-}) {
-    const { t } = useTranslation();
-    const snackbarController = useSnackbarController();
-    const [copied, setCopied] = useState(false);
-
-    const handleCopyPassword = async () => {
-        if (!result.temporaryPassword) return;
-        try {
-            await navigator.clipboard.writeText(result.temporaryPassword);
-            setCopied(true);
-            snackbarController.open({ type: "success",
-message: t("password_copied") ?? "Password copied to clipboard" });
-            setTimeout(() => setCopied(false), 3000);
-        } catch {
-            // Fallback for older browsers
-            const textArea = document.createElement("textarea");
-            textArea.value = result.temporaryPassword;
-            document.body.appendChild(textArea);
-            textArea.select();
-            document.execCommand("copy");
-            document.body.removeChild(textArea);
-            setCopied(true);
-            setTimeout(() => setCopied(false), 3000);
-        }
-    };
-
-    if (result.invitationSent) {
-        // Invitation sent via email
-        return (
-            <Dialog open={true} onOpenChange={(open) => !open ? onClose() : undefined} maxWidth="xl">
-                <DialogTitle variant="h5" gutterBottom={false}>
-                    <div className="flex items-center gap-3">
-                        <MailIcon/>
-                        {t("invitation_sent_title") ?? "Invitation Sent"}
-                    </div>
-                </DialogTitle>
-                <DialogContent>
-                    <div className="flex flex-col gap-4 py-2">
-                        <div className="bg-green-50 dark:bg-green-900/30 border border-green-200 dark:border-green-800 rounded-lg p-4">
-                            <Typography className="text-green-800 dark:text-green-200">
-                                {(t("invitation_sent") ?? "An invitation email has been sent to {{email}}. They can use the link to set their password.")
-                                    .replace("{{email}}", result.user.email ?? "")}
-                            </Typography>
-                        </div>
-                    </div>
-                </DialogContent>
-                <DialogActions>
-                    <Button variant="filled" onClick={onClose}>
-                        {t("ok")}
-                    </Button>
-                </DialogActions>
-            </Dialog>
-        );
-    }
-
-    if (result.temporaryPassword) {
-        // No email — show temporary password
-        return (
-            <Dialog open={true} onOpenChange={(open) => !open ? onClose() : undefined} maxWidth="xl">
-                <DialogTitle variant="h5" gutterBottom={false}>
-                    {t("temporary_password") ?? "Temporary Password"}
-                </DialogTitle>
-                <DialogContent>
-                    <div className="flex flex-col gap-4 py-2">
-                        <div className="bg-amber-50 dark:bg-amber-900/30 border border-amber-200 dark:border-amber-800 rounded-lg p-4">
-                            <Typography className="text-amber-800 dark:text-amber-200" variant="body2">
-                                {t("temporary_password_description") ??
-                                    "Email is not configured. Share this temporary password with the user securely. It will not be shown again."}
-                            </Typography>
-                        </div>
-
-                        <div>
-                            <Typography variant="caption" color="secondary" className="mb-1">
-                                {t("email")}
-                            </Typography>
-                            <Typography>
-                                {result.user.email}
-                            </Typography>
-                        </div>
-
-                        <div>
-                            <Typography variant="caption" color="secondary" className="mb-1">
-                                {t("temporary_password") ?? "Temporary Password"}
-                            </Typography>
-                            <div className="flex items-center gap-2 mt-1">
-                                <code className="flex-grow bg-surface-100 dark:bg-surface-900 border border-surface-300 dark:border-surface-600 rounded px-3 py-2 font-mono text-base select-all">
-                                    {result.temporaryPassword}
-                                </code>
-                                <Tooltip title={t("copy_password") ?? "CopyIcon password"} asChild>
-                                    <IconButton onClick={handleCopyPassword}>
-                                        {copied ? <CheckCircleIcon className="text-green-600"/> : <CopyIcon/>}
-                                    </IconButton>
-                                </Tooltip>
-                            </div>
-                        </div>
-                    </div>
-                </DialogContent>
-                <DialogActions>
-                    <Button variant="filled" onClick={onClose}>
-                        {t("ok")}
-                    </Button>
-                </DialogActions>
-            </Dialog>
-        );
-    }
-
-    // Shouldn't happen, but fallback
-    return null;
-}
-
 // ============================================
 // UserDetailsForm Component
 // ============================================

package/src/components/app/Scaffold.tsx

@@ -1,10 +1,9 @@
 import React, { PropsWithChildren, useCallback, useMemo } from "react";
 import { cls, defaultBorderMixin, IconButton, Sheet, Tooltip } from "@rebasepro/ui";
-import { ChevronLeftIcon, MenuIcon } from "lucide-react";
+import { ChevronLeftIcon, ErrorBoundary, MenuIcon } from "@rebasepro/ui";
 import { deepEqual as equal } from "fast-equals"
 
 import { useLargeLayout, useAdminModeController, useTranslation } from "@rebasepro/core";
-import { ErrorBoundary } from "@rebasepro/ui";
 import { AppContext } from "./useApp";
 
 export const DRAWER_WIDTH = 280;

package/src/components/common/default_entity_actions.tsx

@@ -1,11 +1,13 @@
-import { CopyIcon, PencilIcon, Trash2Icon } from "lucide-react";
-import { iconSize } from "@rebasepro/ui";
-import type { EntityAction } from "@rebasepro/types";
-;
+import { CopyIcon, iconSize, KeyRoundIcon, PencilIcon, Trash2Icon } from "@rebasepro/ui";
+import type { EntityAction, User, UserCreationResult } from "@rebasepro/types";
+import { ConfirmationDialog, useInternalUserManagementController, useSnackbarController, useTranslation } from "@rebasepro/core";
 import { DeleteEntityDialog } from "../DeleteEntityDialog";
 import { addRecentId } from "../EntityCollectionView/utils";
 import { navigateToEntity } from "../../util/navigation_utils";
 import { resolveDefaultSelectedView } from "@rebasepro/common";
+import { CreationResultDialog } from "../admin/CreationResultDialog";
+import React, { useState } from "react";
+
 
 export const editEntityAction: EntityAction = {
     icon: <PencilIcon size={iconSize.smallest}/>,
@@ -44,13 +46,15 @@ export const editEntityAction: EntityAction = {
         }
 
         const newFullIdPath = path ?? collection?.slug ?? entity.path;
-        const defaultSelectedView = resolveDefaultSelectedView(
-            collection ? collection.defaultSelectedView : undefined,
-            {
-                status: "existing",
-                entityId: entity.id
-            }
-        );
+        const defaultSelectedView = collection?.defaultEntityAction === "view"
+            ? "edit"
+            : resolveDefaultSelectedView(
+                collection ? collection.defaultSelectedView : undefined,
+                {
+                    status: "existing",
+                    entityId: entity.id
+                }
+            );
         navigateToEntity({
             openEntityMode,
             collection,
@@ -150,7 +154,110 @@ export const deleteEntityAction: EntityAction = {
                     }}
                     onClose={closeDialog}/>;
             }
-        })
+        });
         return Promise.resolve(undefined);
     }
 }
+
+export function ResetPasswordActionDialog({
+    user,
+    open,
+    onClose
+}: {
+    user: User;
+    open: boolean;
+    onClose: () => void;
+}) {
+    const userManagement = useInternalUserManagementController();
+    const snackbarController = useSnackbarController();
+    const { t } = useTranslation();
+    const [loading, setLoading] = useState(false);
+    const [creationResult, setCreationResult] = useState<UserCreationResult | null>(null);
+
+    const handleConfirm = async () => {
+        if (!userManagement?.resetPassword) return;
+        setLoading(true);
+        try {
+            const result = await userManagement.resetPassword(user);
+            setCreationResult(result);
+            snackbarController.open({
+                type: "success",
+                message: t("reset_password_success") || "Password reset successfully"
+            });
+        } catch (error: unknown) {
+            snackbarController.open({
+                type: "error",
+                message: error instanceof Error ? error.message : (t("error_resetting_password") || "Error resetting password")
+            });
+            onClose();
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    if (creationResult) {
+        return (
+            <CreationResultDialog
+                result={creationResult}
+                onClose={() => {
+                    setCreationResult(null);
+                    onClose();
+                }}
+            />
+        );
+    }
+
+    return (
+        <ConfirmationDialog
+            open={open}
+            loading={loading}
+            onAccept={handleConfirm}
+            onCancel={onClose}
+            title={<>{t("reset_password") || "Reset Password"}</>}
+            body={<>{t("reset_password_confirmation") || "Are you sure you want to reset this user's password?"}</>}
+        />
+    );
+}
+
+export const resetPasswordAction: EntityAction = {
+    icon: <KeyRoundIcon size={iconSize.smallest}/>,
+    name: "Reset Password",
+    key: "reset_password",
+    collapsed: false,
+    showActionsInListView: true,
+    isEnabled: ({ entity }) => Boolean(entity),
+    onClick({
+        entity,
+        context,
+    }): Promise<void> {
+        if (!entity) {
+            throw new Error("INTERNAL: resetPasswordAction: Entity is undefined");
+        }
+        if (!context.dialogsController) {
+            throw new Error("INTERNAL: resetPasswordAction: context.dialogsController is undefined");
+        }
+
+        const user: User = {
+            uid: entity.id as string,
+            email: entity.values?.email as string,
+            displayName: entity.values?.displayName as string || null,
+            photoURL: entity.values?.photoURL as string || null,
+            providerId: entity.values?.providerId as string || "custom",
+            isAnonymous: entity.values?.isAnonymous as boolean || false,
+            roles: entity.values?.roles as string[] || []
+        };
+
+        const { closeDialog } = context.dialogsController.open({
+            key: "reset_password_dialog_" + entity.id,
+            Component: ({ open }) => (
+                <ResetPasswordActionDialog
+                    user={user}
+                    open={open}
+                    onClose={closeDialog}
+                />
+            )
+        });
+        return Promise.resolve(undefined);
+    }
+};
+

package/src/components/field_configs.tsx

@@ -1,6 +1,6 @@
 
 import type { DefaultFieldConfig } from "../types/fields";
-import type { ArrayProperty, NumberProperty, Property, PropertyConfig, StringProperty } from "@rebasepro/types";
+import type { ArrayProperty, NumberProperty, Property, PropertyConfig, StringProperty, VectorProperty } from "@rebasepro/types";
 import { ArrayCustomShapedFieldBinding } from "../form/field_bindings/ArrayCustomShapedFieldBinding";
 import { ArrayOfReferencesFieldBinding } from "../form/field_bindings/ArrayOfReferencesFieldBinding";
 import { BlockFieldBinding } from "../form/field_bindings/BlockFieldBinding";
@@ -16,9 +16,29 @@ import { SelectFieldBinding } from "../form/field_bindings/SelectFieldBinding";
 import { StorageUploadFieldBinding } from "../form/field_bindings/StorageUploadFieldBinding";
 import { SwitchFieldBinding } from "../form/field_bindings/SwitchFieldBinding";
 import { TextFieldBinding } from "../form/field_bindings/TextFieldBinding";
+import { VectorFieldBinding } from "../form/field_bindings/VectorFieldBinding";
 import { isPropertyBuilder } from "@rebasepro/common";
 
-import { FolderUpIcon, FlagIcon, GlobeIcon, ListIcon, TextIcon, UserCheckIcon, Rows3Icon, LinkIcon, VoteIcon, ListOrderedIcon, QuoteIcon, MailIcon, HashIcon, UserIcon, RepeatIcon, CalendarIcon, AlignLeftIcon, UploadIcon } from "lucide-react";
+import {
+    AlignLeftIcon,
+    CalendarIcon,
+    FlagIcon,
+    FolderUpIcon,
+    GlobeIcon,
+    HashIcon,
+    LinkIcon,
+    ListIcon,
+    ListOrderedIcon,
+    MailIcon,
+    QuoteIcon,
+    RepeatIcon,
+    Rows3Icon,
+    TextIcon,
+    UploadIcon,
+    UserCheckIcon,
+    UserIcon,
+    VoteIcon
+} from "@rebasepro/ui";
 import { RelationFieldBinding } from "../form/field_bindings/RelationFieldBinding";
 import { UserSelectFieldBinding } from "../form/field_bindings/UserSelectFieldBinding";
 import { mergeDeep } from "@rebasepro/utils";
@@ -318,6 +338,18 @@ export const DEFAULT_FIELD_CONFIGS: Record<DefaultFieldConfig, PropertyConfig> =
             },
             ui: { Field: BlockFieldBinding }
         }
+    },
+    vector_input: {
+        key: "vector_input",
+        name: "Vector input",
+        description: "Vector array for embeddings",
+        Icon: HashIcon,
+        color: "#bec920",
+        property: {
+            type: "vector",
+            dimensions: 1536,
+            ui: { Field: VectorFieldBinding }
+        }
     }
 };
 
@@ -358,7 +390,7 @@ export function getDefaultFieldId(property: Property) {
             return "select";
         } else if (property.userSelect) {
             return "user_select";
-        } else if ((property as any).reference) {
+        } else if ((property as StringProperty).reference) {
             return "reference_as_string";
         } else {
             return "text_field";
@@ -407,6 +439,10 @@ export function getDefaultFieldId(property: Property) {
         return "relation";
     } else if (property.type === "reference") {
         return "reference";
+    } else if (property.type === "vector") {
+        return "vector_input";
+    } else if (property.type === "binary") {
+        return "text_field";
     }
 
     console.error("Unsupported field config mapping", property);

package/src/components/history/EntityHistoryEntry.tsx

@@ -2,8 +2,7 @@ import type { EntityCollection } from "@rebasepro/types";
 import type { Property } from "@rebasepro/types";
 import * as React from "react";
 
-import { Chip, cls, defaultBorderMixin, Tooltip, Typography , iconSize } from "@rebasepro/ui";
-import { ArrowLeftIcon } from "lucide-react";
+import { ArrowLeftIcon, Chip, cls, defaultBorderMixin, iconSize, Tooltip, Typography } from "@rebasepro/ui";
 import { PreviewSize } from "../../types/components/PropertyPreviewProps";
 import { getPropertyInPath } from "../../util/property_utils";
 import { PropertyPreview } from "../../preview/PropertyPreview";

package/src/components/history/EntityHistoryView.tsx

@@ -2,11 +2,10 @@
 import type { EntityCustomViewParams } from "@rebasepro/types";
 import { useRef, useEffect } from "react";
 import { cls, IconButton, Label, Tooltip, Typography } from "@rebasepro/ui";
-import { HistoryIcon } from "lucide-react";
+import { ErrorBoundary, HistoryIcon } from "@rebasepro/ui";
 import { EntityHistoryEntry } from "./EntityHistoryEntry";
 import { useSnackbarController, useAuthController } from "@rebasepro/core";
 import { ConfirmationDialog } from "@rebasepro/core";
-import { ErrorBoundary } from "@rebasepro/ui";
 import { useState } from "react";
 import { useEntityHistory } from "../../index";
 

package/src/components/index.ts

@@ -1,6 +1,8 @@
 export type { EntityViewProps } from "./EntityView";
 export { EntityView } from "./EntityView";
 
+export * from "./EntityDetailView";
+
 export type { EntitySelectionProps } from "./ReferenceTable/EntitySelectionTable";
 export { EntitySelectionTable } from "./ReferenceTable/EntitySelectionTable";
 

package/src/data_export/export/BasicExportAction.tsx

@@ -2,8 +2,21 @@
 import React, { useCallback } from "react";
 
 import { Entity, Properties } from "@rebasepro/types";
-import { BooleanSwitchWithLabel, Button, cls, Dialog, DialogActions, DialogContent, DialogTitle, IconButton, Tooltip } from "@rebasepro/ui";
-import { DownloadIcon } from "lucide-react";
+import {
+    BooleanSwitchWithLabel,
+    Button,
+    Dialog,
+    DialogActions,
+    DialogContent,
+    DialogTitle,
+    DownloadIcon,
+    IconButton,
+    Label,
+    RadioGroup,
+    RadioGroupItem,
+    Tooltip,
+    Typography
+} from "@rebasepro/ui";
 import { downloadEntitiesExport } from "./export";
 
 export type BasicExportActionProps = {
@@ -73,45 +86,29 @@ export function BasicExportAction({
 
                 <div className={"flex flex-row gap-4"}>
                     <div className={"p-4 flex flex-col"}>
-                        <div className="flex items-center">
-                            <input id="radio-csv" type="radio" value="csv" name="exportType"
-                                checked={exportType === "csv"}
-                                onChange={() => setExportType("csv")}
-                                className={cls("w-4 bg-surface-100 border-surface-300 dark:bg-surface-700 dark:border-surface-600")}/>
-                            <label htmlFor="radio-csv"
-                                className="p-2 text-sm font-medium text-surface-900 dark:text-surface-accent-300">CSV</label>
-                        </div>
-                        <div className="flex items-center">
-                            <input id="radio-json" type="radio" value="json" name="exportType"
-                                checked={exportType === "json"}
-                                onChange={() => setExportType("json")}
-                                className={cls("w-4 bg-surface-100 border-surface-300 dark:bg-surface-700 dark:border-surface-600")}/>
-                            <label htmlFor="radio-json"
-                                className="p-2 text-sm font-medium text-surface-900 dark:text-surface-accent-300">JSON</label>
-                        </div>
+                        <RadioGroup value={exportType} onValueChange={(v) => setExportType(v as "csv" | "json")}>
+                            <div className="flex items-center gap-2">
+                                <RadioGroupItem value="csv" id="radio-csv"/>
+                                <Label htmlFor="radio-csv">CSV</Label>
+                            </div>
+                            <div className="flex items-center gap-2">
+                                <RadioGroupItem value="json" id="radio-json"/>
+                                <Label htmlFor="radio-json">JSON</Label>
+                            </div>
+                        </RadioGroup>
                     </div>
 
                     <div className={"p-4 flex flex-col"}>
-                        <div className="flex items-center">
-                            <input id="radio-timestamp" type="radio" value="timestamp" name="dateExportType"
-                                checked={dateExportType === "timestamp"}
-                                onChange={() => setDateExportType("timestamp")}
-                                className={cls("w-4 bg-surface-100 border-surface-300 dark:bg-surface-700 dark:border-surface-600")}/>
-                            <label htmlFor="radio-timestamp"
-                                className="p-2 text-sm font-medium text-surface-900 dark:text-surface-accent-300">Dates
-                                as
-                                timestamps ({dateRef.current.getTime()})</label>
-                        </div>
-                        <div className="flex items-center">
-                            <input id="radio-string" type="radio" value="string" name="dateExportType"
-                                checked={dateExportType === "string"}
-                                onChange={() => setDateExportType("string")}
-                                className={cls("w-4 bg-surface-100 border-surface-300 dark:bg-surface-700 dark:border-surface-600")}/>
-                            <label htmlFor="radio-string"
-                                className="p-2 text-sm font-medium text-surface-900 dark:text-surface-accent-300">Dates
-                                as
-                                strings ({dateRef.current.toISOString()})</label>
-                        </div>
+                        <RadioGroup value={dateExportType} onValueChange={(v) => setDateExportType(v as "timestamp" | "string")}>
+                            <div className="flex items-center gap-2">
+                                <RadioGroupItem value="timestamp" id="radio-timestamp"/>
+                                <Label htmlFor="radio-timestamp">Dates as timestamps ({dateRef.current.getTime()})</Label>
+                            </div>
+                            <div className="flex items-center gap-2">
+                                <RadioGroupItem value="string" id="radio-string"/>
+                                <Label htmlFor="radio-string">Dates as strings ({dateRef.current.toISOString()})</Label>
+                            </div>
+                        </RadioGroup>
                     </div>
                 </div>