feat: user profiles (#32)

* add user profiles and theme selectors

* lowercase buttons by default

* basic layout

* (wip) init token APIs

* refactor server to support variable options

* fix types

* api refactor / registration tests

* implement UI for url and join

* remove console.logs

* rename repository factory

* fix upload size

frontend/lib/api/__test__/public.test.ts

@@ -1,5 +1,17 @@
 import { describe, test, expect } from "vitest";
-import { client, userClient } from "./test-utils";
+import { faker } from "@faker-js/faker";
+import { UserRegistration } from "../types/data-contracts";
+import { client, sharedUserClient, userClient } from "./test-utils";
+
+function userFactory(): UserRegistration {
+  return {
+    email: faker.internet.email(),
+    password: faker.internet.password(),
+    name: faker.name.firstName(),
+    groupName: faker.animal.cat(),
+    token: "",
+  };
+}
 
 describe("[GET] /api/v1/status", () => {
   test("server should respond", async () => {
@@ -10,14 +22,9 @@ describe("[GET] /api/v1/status", () => {
   });
 });
 
-describe("first time user workflow (register, login)", () => {
+describe("first time user workflow (register, login, join group)", () => {
   const api = client();
-  const userData = {
-    groupName: "test-group",
-    email: "test-user@email.com",
-    name: "test-user",
-    password: "test-password",
-  };
+  const userData = userFactory();
 
   test("user should be able to register", async () => {
     const { response } = await api.register(userData);
@@ -32,8 +39,47 @@ describe("first time user workflow (register, login)", () => {
     // Cleanup
     const userApi = userClient(data.token);
     {
-      const { response } = await userApi.deleteAccount();
+      const { response } = await userApi.user.delete();
       expect(response.status).toBe(204);
     }
   });
+
+  test("user should be able to join create join token and have user signup", async () => {
+    // Setup User 1 Token
+
+    const client = await sharedUserClient();
+    const { data: user1 } = await client.user.self();
+
+    const { response, data } = await client.group.createInvitation({
+      expiresAt: new Date(Date.now() + 1000 * 60 * 60 * 24 * 7),
+      uses: 1,
+    });
+
+    expect(response.status).toBe(201);
+    expect(data.token).toBeTruthy();
+
+    // Create User 2 with token
+
+    const duplicateUser = userFactory();
+    duplicateUser.token = data.token;
+
+    const { response: registerResp } = await api.register(duplicateUser);
+    expect(registerResp.status).toBe(204);
+
+    const { response: loginResp, data: loginData } = await api.login(duplicateUser.email, duplicateUser.password);
+    expect(loginResp.status).toBe(200);
+
+    // Get Self and Assert
+
+    const client2 = userClient(loginData.token);
+
+    const { data: user2 } = await client2.user.self();
+
+    user2.item.groupName = user1.item.groupName;
+
+    // Cleanup User 2
+
+    const { response: deleteResp } = await client2.user.delete();
+    expect(deleteResp.status).toBe(204);
+  });
 });

frontend/lib/api/__test__/test-utils.ts

@@ -3,7 +3,7 @@ import { Requests } from "../../requests";
 import { overrideParts } from "../base/urls";
 import { PublicApi } from "../public";
 import * as config from "../../../test/config";
-import { UserApi } from "../user";
+import { UserClient } from "../user";
 
 export function client() {
   overrideParts(config.BASE_URL, "/api/v1");
@@ -14,7 +14,7 @@ export function client() {
 export function userClient(token: string) {
   overrideParts(config.BASE_URL, "/api/v1");
   const requests = new Requests("", token);
-  return new UserApi(requests);
+  return new UserClient(requests);
 }
 
 const cache = {
@@ -25,7 +25,7 @@ const cache = {
  * Shared UserApi token for tests where the creation of a user is _not_ import
  * to the test. This is useful for tests that are testing the user API itself.
  */
-export async function sharedUserClient(): Promise<UserApi> {
+export async function sharedUserClient(): Promise<UserClient> {
   if (cache.token) {
     return userClient(cache.token);
   }

frontend/lib/api/__test__/user/items.test.ts

@@ -1,7 +1,7 @@
 import { describe, test, expect } from "vitest";
 import { LocationOut } from "../../types/data-contracts";
 import { AttachmentTypes } from "../../types/non-generated";
-import { UserApi } from "../../user";
+import { UserClient } from "../../user";
 import { sharedUserClient } from "../test-utils";
 
 describe("user should be able to create an item and add an attachment", () => {
@@ -10,7 +10,7 @@ describe("user should be able to create an item and add an attachment", () => {
    * useLocatio sets up a location resource for testing, and returns a function
    * that can be used to delete the location from the backend server.
    */
-  async function useLocation(api: UserApi): Promise<[LocationOut, () => Promise<void>]> {
+  async function useLocation(api: UserClient): Promise<[LocationOut, () => Promise<void>]> {
     const { response, data } = await api.locations.create({
       name: `__test__.location.name_${increment}`,
       description: `__test__.location.description_${increment}`,

frontend/lib/api/__test__/user/labels.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, test } from "vitest";
 import { LabelOut } from "../../types/data-contracts";
-import { UserApi } from "../../user";
+import { UserClient } from "../../user";
 import { sharedUserClient } from "../test-utils";
 
 describe("locations lifecycle (create, update, delete)", () => {
@@ -10,7 +10,7 @@ describe("locations lifecycle (create, update, delete)", () => {
    * useLabel sets up a label resource for testing, and returns a function
    * that can be used to delete the label from the backend server.
    */
-  async function useLabel(api: UserApi): Promise<[LabelOut, () => Promise<void>]> {
+  async function useLabel(api: UserClient): Promise<[LabelOut, () => Promise<void>]> {
     const { response, data } = await api.labels.create({
       name: `__test__.label.name_${increment}`,
       description: `__test__.label.description_${increment}`,

frontend/lib/api/__test__/user/locations.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, test } from "vitest";
 import { LocationOut } from "../../types/data-contracts";
-import { UserApi } from "../../user";
+import { UserClient } from "../../user";
 import { sharedUserClient } from "../test-utils";
 
 describe("locations lifecycle (create, update, delete)", () => {
@@ -10,7 +10,7 @@ describe("locations lifecycle (create, update, delete)", () => {
    * useLocatio sets up a location resource for testing, and returns a function
    * that can be used to delete the location from the backend server.
    */
-  async function useLocation(api: UserApi): Promise<[LocationOut, () => Promise<void>]> {
+  async function useLocation(api: UserClient): Promise<[LocationOut, () => Promise<void>]> {
     const { response, data } = await api.locations.create({
       name: `__test__.location.name_${increment}`,
       description: `__test__.location.description_${increment}`,

frontend/lib/api/classes/group.ts

@@ -0,0 +1,11 @@
+import { BaseAPI, route } from "../base";
+import { GroupInvitation, GroupInvitationCreate } from "../types/data-contracts";
+
+export class GroupApi extends BaseAPI {
+  createInvitation(data: GroupInvitationCreate) {
+    return this.http.post<GroupInvitationCreate, GroupInvitation>({
+      url: route("/groups/invitations"),
+      body: data,
+    });
+  }
+}

frontend/lib/api/classes/users.ts

@@ -0,0 +1,17 @@
+import { BaseAPI, route } from "../base";
+import { UserOut } from "../types/data-contracts";
+import { Result } from "../types/non-generated";
+
+export class UserApi extends BaseAPI {
+  public self() {
+    return this.http.get<Result<UserOut>>({ url: route("/users/self") });
+  }
+
+  public logout() {
+    return this.http.post<object, void>({ url: route("/users/logout") });
+  }
+
+  public delete() {
+    return this.http.delete<void>({ url: route("/users/self") });
+  }
+}

frontend/lib/api/types/data-contracts.ts

@@ -222,6 +222,7 @@ export interface UserRegistration {
   groupName: string;
   name: string;
   password: string;
+  token: string;
 }
 
 export interface ApiSummary {
@@ -238,11 +239,22 @@ export interface Build {
   version: string;
 }
 
+export interface GroupInvitation {
+  expiresAt: Date;
+  token: string;
+  uses: number;
+}
+
+export interface GroupInvitationCreate {
+  expiresAt: Date;
+  uses: number;
+}
+
 export interface ItemAttachmentToken {
   token: string;
 }
 
 export interface TokenResponse {
-  expiresAt: string;
+  expiresAt: Date;
   token: string;
 }

frontend/lib/api/types/non-generated.ts

@@ -4,3 +4,7 @@ export enum AttachmentTypes {
   Warranty = "warranty",
   Attachment = "attachment",
 }
+
+export type Result<T> = {
+  item: T;
+};

frontend/lib/api/user.ts

@@ -1,37 +1,42 @@
-import { BaseAPI, route } from "./base";
+import { BaseAPI } from "./base";
 import { ItemsApi } from "./classes/items";
 import { LabelsApi } from "./classes/labels";
 import { LocationsApi } from "./classes/locations";
-import { UserOut } from "./types/data-contracts";
+import { GroupApi } from "./classes/group";
+import { UserApi } from "./classes/users";
 import { Requests } from "~~/lib/requests";
 
-export type Result<T> = {
-  item: T;
-};
-
-export class UserApi extends BaseAPI {
+export class UserClient extends BaseAPI {
   locations: LocationsApi;
   labels: LabelsApi;
   items: ItemsApi;
+  group: GroupApi;
+  user: UserApi;
+
   constructor(requests: Requests) {
     super(requests);
 
     this.locations = new LocationsApi(requests);
     this.labels = new LabelsApi(requests);
     this.items = new ItemsApi(requests);
+    this.group = new GroupApi(requests);
+    this.user = new UserApi(requests);
 
     Object.freeze(this);
   }
 
+  /** @deprecated use this.user.self() */
   public self() {
-    return this.http.get<Result<UserOut>>({ url: route("/users/self") });
+    return this.user.self();
   }
 
+  /** @deprecated use this.user.logout() */
   public logout() {
-    return this.http.post<object, void>({ url: route("/users/logout") });
+    return this.user.logout();
   }
 
+  /** @deprecated use this.user.delete() */
   public deleteAccount() {
-    return this.http.delete<void>({ url: route("/users/self") });
+    return this.user.delete();
   }
 }