web/admin: rework initial wizard pages and add grid layout #9668

BeryJu · 2024-05-09T19:45:51Z

Signed-off-by: Jens Langhammer jens@goauthentik.io<!--
👋 Hi there! Welcome.

Please check the Contributing guidelines: https://goauthentik.io/developer-docs/#how-can-i-contribute
-->

Details

REPLACE ME

Checklist

Local tests pass (ak test authentik/)
The code has been formatted (make lint-fix)

If an API change has been made

The API schema has been updated (make gen-build)

If changes to the frontend have been made

The code has been formatted (make web)

If applicable

The documentation has been updated
The documentation has been formatted (make website)

netlify · 2024-05-09T19:46:08Z

✅ Deploy Preview for authentik-docs canceled.

Name	Link
🔨 Latest commit	`e76758a`
🔍 Latest deploy log	https://app.netlify.com/sites/authentik-docs/deploys/664d2ccb3e9cc700079e7e9c

netlify · 2024-05-09T19:46:08Z

✅ Deploy Preview for authentik-storybook ready!

Name	Link
🔨 Latest commit	`e76758a`
🔍 Latest deploy log	https://app.netlify.com/sites/authentik-storybook/deploys/664d2ccbb04d350007f5b457
😎 Deploy Preview	https://deploy-preview-9668--authentik-storybook.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

codecov · 2024-05-09T19:54:42Z

Codecov Report

Attention: Patch coverage is 93.20988% with 11 lines in your changes are missing coverage. Please review.

Project coverage is 92.64%. Comparing base (a5467c6) to head (e76758a).
Report is 1 commits behind head on main.

Files	Patch %	Lines
authentik/core/api/object_types.py	90.00%	4 Missing ⚠️
authentik/sources/oauth/models.py	89.28%	3 Missing ⚠️
authentik/core/models.py	66.66%	1 Missing ⚠️
authentik/sources/ldap/models.py	75.00%	1 Missing ⚠️
authentik/sources/saml/models.py	83.33%	1 Missing ⚠️
authentik/sources/scim/models.py	75.00%	1 Missing ⚠️

Additional details and impacted files

@@           Coverage Diff           @@
##             main    #9668   +/-   ##
=======================================
  Coverage   92.63%   92.64%           
=======================================
  Files         709      710    +1     
  Lines       34659    34706   +47     
=======================================
+ Hits        32105    32152   +47     
  Misses       2554     2554

Flag	Coverage Δ
e2e	`49.67% <72.22%> (+0.03%)`	⬆️
integration	`25.51% <58.02%> (+0.13%)`	⬆️
unit	`90.09% <93.20%> (+<0.01%)`	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

github-actions · 2024-05-09T20:10:12Z

authentik PR Installation instructions

Instructions for docker-compose

Add the following block to your .env file:

AUTHENTIK_IMAGE=ghcr.io/goauthentik/dev-server
AUTHENTIK_TAG=gh-ghcr.io/goauthentik/dev-server:gh-e76758ae0339a4cc8b6bb2f341fa03862e8de992
AUTHENTIK_OUTPOSTS__CONTAINER_IMAGE_BASE=ghcr.io/goauthentik/dev-%(type)s:gh-%(build_hash)s

For arm64, use these values:

AUTHENTIK_IMAGE=ghcr.io/goauthentik/dev-server
AUTHENTIK_TAG=gh-ghcr.io/goauthentik/dev-server:gh-e76758ae0339a4cc8b6bb2f341fa03862e8de992-arm64
AUTHENTIK_OUTPOSTS__CONTAINER_IMAGE_BASE=ghcr.io/goauthentik/dev-%(type)s:gh-%(build_hash)s

Afterwards, run the upgrade commands from the latest release notes.

Instructions for Kubernetes

Add the following block to your values.yml file:

authentik:
    outposts:
        container_image_base: ghcr.io/goauthentik/dev-%(type)s:gh-%(build_hash)s
image:
    repository: ghcr.io/goauthentik/dev-server
    tag: gh-ghcr.io/goauthentik/dev-server:gh-e76758ae0339a4cc8b6bb2f341fa03862e8de992

For arm64, use these values:

authentik:
    outposts:
        container_image_base: ghcr.io/goauthentik/dev-%(type)s:gh-%(build_hash)s
image:
    repository: ghcr.io/goauthentik/dev-server
    tag: gh-ghcr.io/goauthentik/dev-server:gh-e76758ae0339a4cc8b6bb2f341fa03862e8de992-arm64

Afterwards, run the upgrade commands from the latest release notes.

authentik-automation · 2024-05-09T23:25:03Z

Images automagically compressed by Calibre's image-actions ✨

Compression reduced images by 25.1%, saving 24.92 KB.

Filename	Before	After	Improvement	Visual comparison
`web/authentik/sources/saml.png`	99.10 KB	74.19 KB	-25.1%	View diff

155 images did not require optimisation.

kensternberg-authentik

I approve of these changes, especially the abstraction of the "choose your type", although you're still thinking in an OO way that "routes around" some of the DOM-ness (and at other times is mind-bogglingly into wild things like filling all the slots and then providing only one of them for viewing at any time, which confuses the heck out of the debugger, which I think is nifty).

Anyway, it's nice to see a whole frackload of copy/paste disappear into a simple component.

kensternberg-authentik · 2024-05-10T23:04:12Z

web/src/admin/sources/SourceWizard.ts

 import PFBase from "@patternfly/patternfly/patternfly-base.css";

 import { SourcesApi, TypeCreate } from "@goauthentik/api";

 @customElement("ak-source-wizard-initial")
-export class InitialSourceWizardPage extends WizardPage {


It's always nice to see a change that just makes a whole bunch of code disappear. :-)

web/src/elements/wizard/TypeCreateWizardPage.ts

kensternberg-authentik · 2024-05-10T23:12:59Z

web/tsconfig.json

@@ -2,7 +2,6 @@
    "extends": "./tsconfig.base.json",
    "compilerOptions": {
        "paths": {
-            "@goauthentik/authentik/*": ["src/*"],


Signed-off-by: Jens Langhammer <jens@goauthentik.io>

we should probably replace all icons with coloured ones so we don't need to invert them...I guess Signed-off-by: Jens Langhammer <jens@goauthentik.io>

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

kensternberg-authentik

I like a lot of the changes in the UI! Thanks!

kensternberg-authentik · 2024-05-22T00:30:30Z

...ions/wizard/auth-method-choice/ak-application-wizard-authentication-method-choice.choices.ts


 export const providerRendererList = new Map<string, ProviderRenderer>(
-    _providerModelsTable.map(([modelName, _0, _1, renderer]) => [modelName, renderer]),
+    providerModelsList.map((tc) => [tc.formName, tc.renderer]),


I'm glad this wasn't too confusing. If data is uniform, I like tuples, and I like annotating them.

* main: (36 commits) ci: use container registry for container build cache (#9809) core: bump lxml from 5.2.1 to 5.2.2 (#9717) web: bump mermaid from 10.9.0 to 10.9.1 in /web (#9734) core: bump scim2-filter-parser from 0.5.0 to 0.5.1 (#9730) web: bump core-js from 3.37.0 to 3.37.1 in /web (#9733) stages/authenticator_webauthn: Update FIDO MDS3 & Passkey aaguid blobs (#9729) translate: Updates for file locale/en/LC_MESSAGES/django.po in zh_CN (#9802) translate: Updates for file locale/en/LC_MESSAGES/django.po in zh-Hans (#9803) core: bump sentry-sdk from 2.2.0 to 2.2.1 (#9807) web: bump the storybook group in /web with 7 updates (#9804) web: bump glob from 10.3.15 to 10.3.16 in /web (#9805) root: docker-compose: remove version top level element (#9631) core, web: update translations (#9790) web: bump API Client version (#9801) web/admin: rework initial wizard pages and add grid layout (#9668) website/integrations: discord: fix typo (#9800) website/integration/netbox: fix group custom pipeline example (#9738) root: add primary-replica db router (#9479) website/integrations: add three more policy-expressions to discord-docs (#5760) website/integrations: netbox: add missing scope configuration (#9491) ...

BeryJu requested a review from a team as a code owner May 9, 2024 19:45

BeryJu requested a review from a team as a code owner May 9, 2024 23:24

kensternberg-authentik approved these changes May 10, 2024

View reviewed changes

BeryJu and others added 17 commits May 21, 2024 20:16

remove @goauthentik/authentik as TS path

398a31b

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

initial implementation

07e4106

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

oh yeah

468f96f

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

format earlier changes

d503058

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

support plain alert

207557c

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

initial attempt at dedupe

220f9e0

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

make it a base class

5738e24

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

migrate all wizards

47ce2a1

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

create type create mixin to dedupe more, add icon to source create

ea18b46

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

add ldap icon

b6dd555

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

Optimised images with calibre/image-actions

87bc968

match inverting

06fe6f5

we should probably replace all icons with coloured ones so we don't need to invert them...I guess Signed-off-by: Jens Langhammer <jens@goauthentik.io>

format

a814575

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

make everything more explicit

084911f

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

add icons to provider

9799397

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

add remaining provider icons

71629c2

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

rework to not use inheritance

30e142d

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

BeryJu force-pushed the web/admin/refactor-type-create branch from 6cb4caa to 30e142d Compare May 21, 2024 18:38

fix unrelated typo

0dc5c81

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

BeryJu requested a review from a team as a code owner May 21, 2024 18:41

BeryJu added 2 commits May 22, 2024 01:10

make app wizard use grid layout

dc1c075

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

keep wizard height consistent

8bfd2a0

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

fix tests

e76758a

Signed-off-by: Jens Langhammer <jens@goauthentik.io>

BeryJu requested a review from kensternberg-authentik May 22, 2024 00:18

kensternberg-authentik approved these changes May 22, 2024

View reviewed changes

BeryJu merged commit 6c4c535 into main May 22, 2024
69 checks passed

BeryJu deleted the web/admin/refactor-type-create branch May 22, 2024 00:41

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

web/admin: rework initial wizard pages and add grid layout #9668

web/admin: rework initial wizard pages and add grid layout #9668

BeryJu commented May 9, 2024

netlify bot commented May 9, 2024 •

edited

netlify bot commented May 9, 2024 •

edited

codecov bot commented May 9, 2024 •

edited

github-actions bot commented May 9, 2024 •

edited

authentik-automation bot commented May 9, 2024

kensternberg-authentik left a comment

kensternberg-authentik May 10, 2024

kensternberg-authentik May 10, 2024

kensternberg-authentik left a comment

kensternberg-authentik May 22, 2024

web/admin: rework initial wizard pages and add grid layout #9668

web/admin: rework initial wizard pages and add grid layout #9668

Conversation

BeryJu commented May 9, 2024

Details

Checklist

netlify bot commented May 9, 2024 • edited

✅ Deploy Preview for authentik-docs canceled.

netlify bot commented May 9, 2024 • edited

✅ Deploy Preview for authentik-storybook ready!

codecov bot commented May 9, 2024 • edited

Codecov Report

github-actions bot commented May 9, 2024 • edited

authentik-automation bot commented May 9, 2024

kensternberg-authentik left a comment

Choose a reason for hiding this comment

kensternberg-authentik May 10, 2024

Choose a reason for hiding this comment

kensternberg-authentik May 10, 2024

Choose a reason for hiding this comment

kensternberg-authentik left a comment

Choose a reason for hiding this comment

kensternberg-authentik May 22, 2024

Choose a reason for hiding this comment

netlify bot commented May 9, 2024 •

edited

netlify bot commented May 9, 2024 •

edited

codecov bot commented May 9, 2024 •

edited

github-actions bot commented May 9, 2024 •

edited