After examining how people like Adobe and Salesforce do things, I have updated the storybook configuration to provide run-time configuration of light/dark mode (although right now nothing happens), inject the correct styling into the page, and update the preview handling so that we can see the components better. We'll see how this pans out. I have provided stories for the AggregateCard, AggregatePromiseCard, and a new QuickActionsCard. I also fixed a bug in AggregatePromiseCard where it would fail to report a fetch error. It will only report that "the operation falied," but it will give the full error into the console. **As an experiment**, I have changed the interpreter for `lint:precommit` and `build:watch` to use [Bun](https://bun.sh/) instead of NodeJS. We have observed significant speed-ups and much better memory management with Bun for these two operations. Those are both developer-facing operations, the behavior of the system undur current CI/CD should not change. And finally, I've switched the QuickActionsCard view in Admin-Overview to use the new component. Looks the same. Reads *way* easier. :-)
12 lines
379 B
TypeScript
12 lines
379 B
TypeScript
import { create } from "@storybook/theming/create";
|
|
|
|
const isDarkMode = window.matchMedia("(prefers-color-scheme: dark)").matches;
|
|
|
|
export default create({
|
|
base: isDarkMode ? "dark" : "light",
|
|
brandTitle: "authentik Storybook",
|
|
brandUrl: "https://goauthentik.io",
|
|
brandImage: "https://goauthentik.io/img/icon_left_brand_colour.svg",
|
|
brandTarget: "_self",
|
|
});
|