From 1a132a733f8754635f43c44228c72fa022e8fed1 Mon Sep 17 00:00:00 2001
From: Teffen Ellis <teffen@goauthentik.io>
Date: Sat, 24 May 2025 22:07:29 +0200
Subject: [PATCH] web: Prepare for consistent import styling.

- Prep for Storybook fixes.
---
 packages/prettier-config/lib/constants.js | 26 ++++++++++++-
 packages/prettier-config/package.json     |  2 +-
 web/package.json                          |  2 +-
 web/prettier.config.mjs                   | 45 +++++++++++++++++++++++
 4 files changed, 71 insertions(+), 4 deletions(-)
 create mode 100644 web/prettier.config.mjs

diff --git a/packages/prettier-config/lib/constants.js b/packages/prettier-config/lib/constants.js
index 1f5f9fec1d..3a760c1154 100644
--- a/packages/prettier-config/lib/constants.js
+++ b/packages/prettier-config/lib/constants.js
@@ -31,8 +31,30 @@ export const AuthentikPrettierConfig = {
     trailingComma: "all",
     useTabs: false,
     vueIndentScriptAndStyle: false,
-    plugins: ["prettier-plugin-packagejson", "@trivago/prettier-plugin-sort-imports"],
-    importOrder: ["^(@?)lit(.*)$", "\\.css$", "^@goauthentik/api$", "^[./]"],
+    plugins: [
+        // ---
+        "prettier-plugin-packagejson",
+        "@trivago/prettier-plugin-sort-imports",
+    ],
+    importOrder: [
+        // ---
+        "^(@goauthentik/|#)common.+",
+        "^(@goauthentik/|#)elements.+",
+        "^(@goauthentik/|#)components.+",
+        "^(@goauthentik/|#)user.+",
+        "^(@goauthentik/|#)admin.+",
+        "^(@goauthentik/|#)flow.+",
+
+        "<THIRD_PARTY_MODULES>",
+
+        "^~@goauthentik.+",
+        "^@goauthentik.+",
+        "^(@?)lit(.*)$",
+        "\\.css$",
+        "^@goauthentik/api$",
+        "^[./]",
+    ],
+    importOrderSideEffects: false,
     importOrderSeparation: true,
     importOrderSortSpecifiers: true,
     importOrderParserPlugins: ["typescript", "jsx", "classProperties", "decorators-legacy"],
diff --git a/packages/prettier-config/package.json b/packages/prettier-config/package.json
index 3897f64aca..2738155b88 100644
--- a/packages/prettier-config/package.json
+++ b/packages/prettier-config/package.json
@@ -1,6 +1,6 @@
 {
     "name": "@goauthentik/prettier-config",
-    "version": "1.0.5",
+    "version": "1.1.0",
     "description": "authentik's Prettier config",
     "license": "MIT",
     "scripts": {
diff --git a/web/package.json b/web/package.json
index 27ad30c770..9951759206 100644
--- a/web/package.json
+++ b/web/package.json
@@ -67,6 +67,7 @@
         "#admin/*": "./src/admin/*.js",
         "#flow/*.css": "./src/flow/*.css",
         "#flow/*": "./src/flow/*.js",
+        "#locales/*": "./src/locales/*.js",
         "#stories/*": "./src/stories/*.js",
         "#*/browser": {
             "types": "./out/*/browser.d.ts",
@@ -362,7 +363,6 @@
     "workspaces": [
         "./packages/*"
     ],
-    "prettier": "@goauthentik/prettier-config",
     "overrides": {
         "@storybook/addon-docs": {
             "react": "^19.1.0",
diff --git a/web/prettier.config.mjs b/web/prettier.config.mjs
new file mode 100644
index 0000000000..c1d3f6be2c
--- /dev/null
+++ b/web/prettier.config.mjs
@@ -0,0 +1,45 @@
+/**
+ * @file Prettier configuration for authentik.
+ *
+ * @import { Config as PrettierConfig } from "prettier";
+ * @todo Remove after NPM Workspaces enabled.
+ */
+// @ts-ignore
+import { AuthentikPrettierConfig } from "@goauthentik/prettier-config";
+
+/**
+ * @type {PrettierConfig}
+ */
+const config = {
+    ...AuthentikPrettierConfig,
+
+    importOrder: [
+        // ---
+
+        "^~#common.+",
+        "^~#elements.+",
+        "^~#components.+",
+        "^~#user.+",
+        "^~#admin.+",
+        "^~#flow.+",
+
+        "^(@goauthentik/|#)common.+",
+        "^(@goauthentik/|#)elements.+",
+        "^(@goauthentik/|#)components.+",
+        "^(@goauthentik/|#)user.+",
+        "^(@goauthentik/|#)admin.+",
+        "^(@goauthentik/|#)flow.+",
+
+        "<THIRD_PARTY_MODULES>",
+
+        "^@goauthentik.+",
+        "^(@?)lit(.*)$",
+        "\\.css$",
+        "^@goauthentik/api$",
+        "^[./]",
+    ],
+    importOrderSideEffects: false,
+    importOrderSeparation: true,
+};
+
+export default config;