shishantbiswas/bknd
1
0
Fork 0
mirror of https://github.com/shishantbiswas/bknd.git synced 2026-03-16 04:27:21 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix: when auth is disabled, the users entity doesn't exist

Browse Source
This commit is contained in:
dswbx
2024-11-21 08:23:16 +01:00
parent 4e7c1e6e9f
commit 0df5c761ec
14 changed files with 212 additions and 74 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
app/src/ui/components/display/Alert.tsx Normal file
View File

@@ -0,0 +1,35 @@
import type { ComponentPropsWithoutRef } from "react";
import { twMerge } from "tailwind-merge";
export type AlertProps = ComponentPropsWithoutRef<"div"> & {
className?: string;
visible?: boolean;
title?: string;
message?: string;
};
const Base: React.FC<AlertProps> = ({ visible = true, title, message, className, ...props }) =>
visible ? (
<div
{...props}
className={twMerge("flex flex-row dark:bg-amber-300/20 bg-amber-200 p-4", className)}
>
<div>
{title && <b className="mr-2">{title}:</b>}
{message}
</div>
</div>
) : null;
const Warning: React.FC<AlertProps> = (props) => (
<Base {...props} className="dark:bg-amber-300/20 bg-amber-200" />
);
const Exception: React.FC<AlertProps> = (props) => (
<Base {...props} className="dark:bg-red-950 bg-red-100" />
);
export const Alert = {
Warning,
Exception
};

2
app/src/ui/components/display/Empty.tsx
View File

@@ -1,6 +1,6 @@
import { Button } from "../buttons/Button";
type EmptyProps = {
export type EmptyProps = {
Icon?: any;
title?: string;
description?: string;

7
app/src/ui/components/display/Message.tsx Normal file
View File

@@ -0,0 +1,7 @@
import { Empty, type EmptyProps } from "./Empty";
const NotFound = (props: Partial<EmptyProps>) => <Empty title="Not Found" {...props} />;
export const Message = {
NotFound
};

2
app/src/ui/layouts/AppShell/AppShell.tsx
View File

@@ -194,7 +194,7 @@ export const SidebarLink = <E extends React.ElementType = "a">({
"flex flex-row px-4 py-2.5 items-center gap-2",
!disabled &&
"cursor-pointer rounded-md [&.active]:bg-primary/10 [&.active]:hover:bg-primary/15 [&.active]:font-medium hover:bg-primary/5 link",
disabled && "opacity-50 cursor-not-allowed",
disabled && "opacity-50 cursor-not-allowed pointer-events-none",
className
)}
>

10
app/src/ui/routes/auth/_auth.root.tsx
View File

@@ -33,16 +33,22 @@ export function AuthRoot({ children }) {
<AppShell.SidebarLink
as={Link}
href={app.getAbsolutePath("/data/" + routes.data.entity.list(users_entity))}
disabled={!config.auth.enabled}
>
Users
</AppShell.SidebarLink>
<AppShell.SidebarLink as={Link} href={routes.auth.roles.list()}>
<AppShell.SidebarLink
as={Link}
href={routes.auth.roles.list()}
disabled={!config.auth.enabled}
>
Roles & Permissions
</AppShell.SidebarLink>
<AppShell.SidebarLink as={Link} href={routes.auth.strategies()} disabled>
Strategies
</AppShell.SidebarLink>
<AppShell.SidebarLink as={Link} href={routes.auth.settings()}>
{/*<AppShell.SidebarLink as={Link} href={routes.auth.settings()}>*/}
<AppShell.SidebarLink as={Link} href={app.getSettingsPath(["auth"])}>
Settings
</AppShell.SidebarLink>
</nav>

25
app/src/ui/routes/auth/auth.index.tsx
View File

@@ -1,4 +1,6 @@
import { useBknd, useClient } from "ui/client";
import { useBkndAuth } from "ui/client/schema/auth/use-bknd-auth";
import { Alert } from "ui/components/display/Alert";
import { routes } from "ui/lib/routes";
import {
Button,
@@ -10,15 +12,13 @@ import * as AppShell from "../../layouts/AppShell/AppShell";
export function AuthIndex() {
const client = useClient();
const { app, config } = useBknd();
const users_entity = config.auth.entity_name;
const { app } = useBknd();
const {
config: { roles, strategies, entity_name, enabled }
} = useBkndAuth();
const users_entity = entity_name;
const query = client.query().data.entity("users").count();
const usersTotal = query.data?.body.count ?? 0;
const {
config: {
auth: { roles, strategies }
}
} = useBknd();
const rolesTotal = Object.keys(roles ?? {}).length ?? 0;
const strategiesTotal = Object.keys(strategies ?? {}).length ?? 0;
@@ -30,11 +30,16 @@ export function AuthIndex() {
<>
<AppShell.SectionHeader>Overview</AppShell.SectionHeader>
<AppShell.Scrollable>
<Alert.Warning
visible={!enabled}
title="Auth not enabled"
message="To use authentication features, please enable it in the settings."
/>
<div className="flex flex-col flex-grow p-3 gap-3">
<div className="grid xs:grid-cols-1 sm:grid-cols-2 xl:grid-cols-4 gap-5">
<KpiCard
title="Users registered"
value={usersTotal}
value={!enabled ? 0 : usersTotal}
actions={[
{
label: "View all",
@@ -45,7 +50,7 @@ export function AuthIndex() {
/>
<KpiCard
title="Roles"
value={rolesTotal}
value={!enabled ? 0 : rolesTotal}
actions={[
{ label: "View all", href: rolesLink },
{ label: "Add new", variant: "default", href: rolesLink }
@@ -53,7 +58,7 @@ export function AuthIndex() {
/>
<KpiCard
title="Strategies enabled"
value={strategiesTotal}
value={!enabled ? 0 : strategiesTotal}
actions={[
{ label: "View all", href: strategiesLink },
{ label: "Add new", variant: "default", href: strategiesLink }

36
app/src/ui/routes/auth/auth.roles.tsx
View File

@@ -1,12 +1,7 @@
import { Modal, TextInput } from "@mantine/core";
import { useDisclosure, useFocusTrap } from "@mantine/hooks";
import { StringIdentifier, transformObject, ucFirstAllSnakeToPascalWithSpaces } from "core/utils";
import { useRef } from "react";
import { useBkndAuth } from "ui/client/schema/auth/use-bknd-auth";
import { JsonSchemaForm } from "ui/components/form/json-schema/JsonSchemaForm";
import { Alert } from "ui/components/display/Alert";
import { bkndModals } from "ui/modals";
import { SchemaFormModal } from "ui/modals/debug/SchemaFormModal";
import { useBknd } from "../../client/BkndProvider";
import { Button } from "../../components/buttons/Button";
import { CellValue, DataTable } from "../../components/table/DataTable";
import * as AppShell from "../../layouts/AppShell/AppShell";
@@ -14,9 +9,6 @@ import { routes, useNavigate } from "../../lib/routes";
export function AuthRolesList() {
const [navigate] = useNavigate();
const [modalOpen, modalHandler] = useDisclosure(false);
const focusRef = useFocusTrap();
const inputRef = useRef<HTMLInputElement>(null);
const { config, actions } = useBkndAuth();
const data = Object.values(
@@ -64,27 +56,6 @@ export function AuthRolesList() {
return (
<>
{/*<Modal
ref={focusRef}
opened={modalOpen}
onClose={modalHandler.close}
title={"New Role"}
classNames={{
root: "bknd-admin",
header: "!bg-primary/5 border-b border-b-muted !py-3 px-5 !h-auto !min-h-px",
content: "rounded-lg select-none",
title: "font-bold !text-md",
body: "pt-3 pb-3 px-3 gap-4 flex flex-col"
}}
>
<TextInput ref={inputRef} data-autofocus size="md" placeholder="Enter role name" />
<div className="flex flex-row justify-end gap-2">
<Button onClick={() => modalHandler.close()}>Cancel</Button>
<Button variant="primary" onClick={handleClickAdd}>
Create
</Button>
</div>
</Modal>*/}
<AppShell.SectionHeader
right={
<Button variant="primary" onClick={openCreateModal}>
@@ -95,6 +66,11 @@ export function AuthRolesList() {
Roles & Permissions
</AppShell.SectionHeader>
<AppShell.Scrollable>
<Alert.Warning
visible={!config.enabled}
title="Auth not enabled"
message="To use authentication features, please enable it in the settings."
/>
<div className="flex flex-col flex-grow p-3 gap-3">
<DataTable
data={data}

51
app/src/ui/routes/auth/auth.settings.tsx
View File

@@ -1,13 +1,28 @@
import { cloneDeep, omit } from "lodash-es";
import { useEffect, useRef } from "react";
import { useBknd } from "ui/client";
import { useBkndAuth } from "ui/client/schema/auth/use-bknd-auth";
import { useBkndData } from "ui/client/schema/data/use-bknd-data";
import { Button } from "ui/components/buttons/Button";
import { JsonSchemaForm } from "ui/components/form/json-schema/JsonSchemaForm";
import { Alert } from "ui/components/display/Alert";
import {
JsonSchemaForm,
type JsonSchemaFormRef
} from "ui/components/form/json-schema/JsonSchemaForm";
import * as AppShell from "ui/layouts/AppShell/AppShell";
import { useNavigate } from "ui/lib/routes";
import { extractSchema } from "../settings/utils/schema";
// @todo: improve the inline editing expierence, for now redirect to settings
export function AuthSettingsList() {
useBknd({ withSecrets: true });
return <AuthSettingsListInternal />;
const { app } = useBknd();
const [navigate] = useNavigate();
useEffect(() => {
navigate(app.getSettingsPath(["auth"]));
}, []);
/*useBknd({ withSecrets: true });
return <AuthSettingsListInternal />;*/
}
const uiSchema = {
@@ -21,9 +36,11 @@ const uiSchema = {
};
function AuthSettingsListInternal() {
const s = useBknd();
const config = s.config.auth;
const schema = cloneDeep(omit(s.schema.auth, ["title"]));
const $auth = useBkndAuth();
const { entities } = useBkndData();
const formRef = useRef<JsonSchemaFormRef>(null);
const config = $auth.config;
const schema = cloneDeep(omit($auth.schema, ["title"]));
const [generalSchema, generalConfig, extracted] = extractSchema(schema as any, config, [
"jwt",
"roles",
@@ -32,7 +49,6 @@ function AuthSettingsListInternal() {
]);
try {
const user_entity = config.entity_name ?? "users";
const entities = s.config.data.entities ?? {};
const user_fields = Object.entries(entities[user_entity]?.fields ?? {})
.map(([name, field]) => (!field.config?.virtual ? name : undefined))
.filter(Boolean);
@@ -42,18 +58,34 @@ function AuthSettingsListInternal() {
extracted.jwt.schema.properties.fields.items.enum = user_fields;
extracted.jwt.schema.properties.fields.uniqueItems = true;
uiSchema.jwt.fields["ui:widget"] = "checkboxes";
} else {
uiSchema.jwt.fields["ui:widget"] = "hidden";
}
} catch (e) {
console.error(e);
}
console.log({ generalSchema, generalConfig, extracted });
async function handleSubmit() {
console.log(formRef.current?.validateForm(), formRef.current?.formData());
}
return (
<>
<AppShell.SectionHeader right={<Button variant="primary">Update</Button>}>
<AppShell.SectionHeader
right={
<Button variant="primary" onClick={handleSubmit}>
Update
</Button>
}
>
Settings
</AppShell.SectionHeader>
<AppShell.Scrollable>
<Alert.Warning
visible={!config.enabled}
title="Auth not enabled"
message="Enable it by toggling the switch below. Please also make sure set a secure secret to sign JWT tokens."
/>
<div className="flex flex-col flex-grow px-5 py-4 gap-8">
<div>
<JsonSchemaForm
@@ -65,6 +97,7 @@ function AuthSettingsListInternal() {
<div className="flex flex-col gap-3">
<h3 className="font-bold">JWT Settings</h3>
<JsonSchemaForm
ref={formRef}
schema={extracted.jwt.schema}
uiSchema={uiSchema.jwt}
className="legacy hide-required-mark fieldset-alternative mute-root"

11
app/src/ui/routes/data/data.$entity.$id.tsx
View File

@@ -3,6 +3,7 @@ import type { Entity, EntityData } from "data";
import type { EntityRelation } from "data";
import { Fragment, memo, useState } from "react";
import { TbArrowLeft, TbDots } from "react-icons/tb";
import { useBkndData } from "ui/client/schema/data/use-bknd-data";
import { EntityForm } from "ui/modules/data/components/EntityForm";
import { EntityTable2 } from "ui/modules/data/components/EntityTable2";
import { useEntityForm } from "ui/modules/data/hooks/useEntityForm";
@@ -20,17 +21,17 @@ import { routes, useNavigate } from "../../lib/routes";
import { bkndModals } from "../../modals";
export function DataEntityUpdate({ params }) {
const { app } = useBknd();
const entity = app.entity(params.entity as string)!;
const { $data, relations } = useBkndData();
const entity = $data.entity(params.entity as string)!;
const entityId = Number.parseInt(params.id as string);
const [error, setError] = useState<string | null>(null);
const [navigate] = useNavigate();
useBrowserTitle(["Data", entity.label, `#${entityId}`]);
const targetRelations = app.relations.listableRelationsOf(entity);
console.log("targetRelations", targetRelations, app.relations.relationsOf(entity));
const targetRelations = relations.listableRelationsOf(entity);
//console.log("targetRelations", targetRelations, relations.relationsOf(entity));
// filter out polymorphic for now
//.filter((r) => r.type() !== "poly");
const local_relation_refs = app.relations
const local_relation_refs = relations
.sourceRelationsOf(entity)
?.map((r) => r.other(entity).reference);

20
app/src/ui/routes/data/data.$entity.index.tsx
View File

@@ -1,6 +1,9 @@
import { Type } from "core/utils";
import { querySchema } from "data";
import { TbDots } from "react-icons/tb";
import { useBkndData } from "ui/client/schema/data/use-bknd-data";
import { Empty } from "ui/components/display/Empty";
import { Message } from "ui/components/display/Message";
import { EntityTable2 } from "ui/modules/data/components/EntityTable2";
import { useBknd } from "../../client";
import { Button } from "../../components/buttons/Button";
@@ -25,22 +28,21 @@ const searchSchema = Type.Composite(
);
export function DataEntityList({ params }) {
console.log("params", params);
const { app } = useBknd();
const entity = app.entity(params.entity as string)!;
const { $data, relations } = useBkndData();
const entity = $data.entity(params.entity as string);
const [navigate] = useNavigate();
const search = useSearch(searchSchema, {
select: entity.getSelect(undefined, "table"),
sort: entity.getDefaultSort()
select: entity?.getSelect(undefined, "table") ?? [],
sort: entity?.getDefaultSort()
});
console.log("search", search.value);
useBrowserTitle(["Data", entity.label]);
useBrowserTitle(["Data", entity?.label ?? params.entity]);
const PER_PAGE_OPTIONS = [5, 10, 25];
//console.log("search", search.value);
function handleClickRow(row: Record<string, any>) {
navigate(routes.data.entity.edit(entity.name, row.id));
if (entity) navigate(routes.data.entity.edit(entity.name, row.id));
}
function handleClickPage(page: number) {
@@ -61,6 +63,10 @@ export function DataEntityList({ params }) {
search.set("perPage", perPage);
}
if (!entity) {
return <Message.NotFound description={`Entity "${params.entity}" doesn't exist.`} />;
}
return (
<>
<AppShell.SectionHeader

11
app/src/ui/routes/settings/components/Setting.tsx
View File

@@ -4,6 +4,7 @@ import { omit } from "lodash-es";
import { type ReactNode, useMemo, useRef, useState } from "react";
import { TbSettings } from "react-icons/tb";
import { useAuth } from "ui";
import { Alert } from "ui/components/display/Alert";
import { Link, Route, useLocation } from "wouter";
import { useBknd } from "../../../client/BkndProvider";
import { Button } from "../../../components/buttons/Button";
@@ -36,6 +37,7 @@ export type SettingProps<
allowDelete?: (config: any) => boolean;
allowEdit?: (config: any) => boolean;
showAlert?: (config: any) => string | ReactNode | undefined;
reloadOnSave?: boolean;
};
properties?: {
[key in keyof Partial<Props>]: {
@@ -151,6 +153,9 @@ export function Setting<Schema extends TObject = any>({
console.log("save:success", success);
if (success) {
if (options?.reloadOnSave) {
window.location.reload();
}
//window.location.reload();
} else {
setSubmitting(false);
@@ -229,11 +234,7 @@ export function Setting<Schema extends TObject = any>({
<Breadcrumbs path={path} />
</AppShell.SectionHeader>
<AppShell.Scrollable key={path.join("-")}>
{showAlert && (
<div className="flex flex-row dark:bg-amber-300/20 bg-amber-200 p-4">
{showAlert}
</div>
)}
{typeof showAlert === "string" && <Alert.Warning message={showAlert} />}
<div className="flex flex-col flex-grow p-3 gap-3">
<JsonSchemaForm

8
app/src/ui/routes/settings/components/SettingNewModal.tsx
View File

@@ -70,9 +70,11 @@ export const SettingNewModal = ({
const [module, ...restOfPath] = path;
const addPath = [...restOfPath, newKey].join(".");
if (await actions.add(module as any, addPath, data)) {
navigate(prefixPath + newKey, {
replace: true
});
setTimeout(() => {
navigate(prefixPath + newKey, {
replace: true
});
}, 500);
} else {
setSubmitting(false);
}

9
app/src/ui/routes/settings/routes/auth.settings.tsx
View File

@@ -115,6 +115,15 @@ export const AuthSettings = ({ schema: _unsafe_copy, config }) => {
schema={_schema}
uiSchema={uiSchema}
config={config}
options={{
showAlert: (config: any) => {
if (!config.enabled) {
return "Auth is disabled. Enable it by toggling the switch below. Please also make sure set a secure secret to sign JWT tokens.";
}
return;
},
reloadOnSave: true
}}
properties={{
strategies: {
extract: true,