fix(auth): render WordmarkLogo react component in auth layout to include lightbg asset

Author: lindwurm

app/javascript/entrypoints/public.tsx

@@ -20,6 +20,7 @@ import loadKeyboardExtensions from '../mastodon/load_keyboard_extensions';
 import { loadLocale, getLocale } from '../mastodon/locales';
 import { loadPolyfills } from '../mastodon/polyfills';
 import ready from '../mastodon/ready';
+import { WordmarkLogo } from '@/mastodon/components/logo';
 
 import 'cocoon-js-vanilla';
 
@@ -183,6 +184,12 @@ function loaded() {
       });
   }
 
+  const authLogoHost = document.querySelector<HTMLElement>('.logo-react-root');
+  if (authLogoHost) {
+    const root = createRoot(authLogoHost);
+    root.render(<WordmarkLogo />);
+  }
+
   on(
     'input',
     'input#user_account_attributes_username',

app/views/layouts/auth.html.haml

@@ -4,11 +4,12 @@
 - content_for :content do
   .container-alt
     .logo-container
-      - if within_authorization_flow?
-        = logo_as_symbol(:wordmark)
-      - else
-        = link_to root_path do
+      .logo-react-root
+        - if within_authorization_flow?
           = logo_as_symbol(:wordmark)
+        - else
+          = link_to root_path do
+            = logo_as_symbol(:wordmark)
 
     .form-container
       = render 'flashes'