Even more read me

README.md

@@ -20,6 +20,21 @@ OTHER_VARIABLE=COOL-VALUE
 | KEYCLOAK_CLIENTSECRET | asdf1234qwerty67890                   |
 | KEYCLOAK_REDIRECTURI  | http://localhost:5173/auth/callback   |
 
+If you are using the docker compose to start the background services, use the following `.env` file
+
+``` dotenv
+DATABASE_URL=postgresql://root:password@localhost:5432
+COOKIE_SECRET=9B36CD3E-78C9-47EF-9DAC-BC808C0C4E4F
+KEYCLOAK_ENDPOINT=http://localhost:8080/realms/master
+KEYCLOAK_CLIENTID=<CLIENTID>
+KEYCLOAK_CLIENTSECRET=<CLIENTSECRET>
+KEYCLOAK_REDIRECTURI=http://localhost:5173/auth/callback
+```
+replace `<CLIENTID>` and `<CLIENTSECRET>` by going to `localhost:8080`, logging in, and creating a client.
+For name, choose `<CLIENTID>`, then choose `client authentication`.
+Make sure to add `Valid redirect URI` from above.
+Find the `<CLIENTSECRET>` by going to the client, and then credentials
+
 ## Hacking
 
 To begin development on the service, start up the `compose.yml` using `docker compose up -d` for a database running at localhost at port 5432.

app/routes/_main.tsx

@@ -58,7 +58,7 @@ function UserProfile() {
 					</DropdownMenuTrigger>
 					<DropdownMenuContent align='end'>
 						<DropdownMenuLabel>
-							{user.name ?? user.email ?? 'Användare'}
+							{user.preferred_username ?? user.email ?? "Användare"}
 						</DropdownMenuLabel>
 						<DropdownMenuSeparator />
 						<DropdownMenuItem>Settings</DropdownMenuItem>

compose.yml

@@ -8,14 +8,18 @@ services:
       - db_data:/var/lib/postgresql/data
     ports:
       - 5432:5432
-  
+
   auth:
     image: quay.io/keycloak/keycloak:latest
     command: start-dev
     environment:
       KEYCLOAK_ADMIN: admin
       KEYCLOAK_ADMIN_PASSWORD: admin
+    volumes:
+      - keycloak_data:/opt/keycloak/data/import
     ports:
       - 8080:8080
+
 volumes:
   db_data:
+  keycloak_data: