testing + small fixes

backend/app/api/v1/v1_ctrl_labels.go

@@ -3,6 +3,7 @@ package v1
 import (
 	"net/http"
 
+	"github.com/hay-kot/content/backend/ent"
 	"github.com/hay-kot/content/backend/internal/services"
 	"github.com/hay-kot/content/backend/internal/types"
 	"github.com/hay-kot/content/backend/pkgs/server"
@@ -101,6 +102,13 @@ func (ctrl *V1Controller) HandleLabelGet() http.HandlerFunc {
 
 		labels, err := ctrl.svc.Labels.Get(r.Context(), user.GroupID, uid)
 		if err != nil {
+			if ent.IsNotFound(err) {
+				log.Err(err).
+					Str("id", uid.String()).
+					Msg("label not found")
+				server.RespondError(w, http.StatusNotFound, err)
+				return
+			}
 			log.Err(err).Msg("error getting label")
 			server.RespondServerError(w)
 			return

backend/app/api/v1/v1_ctrl_locations.go

@@ -3,6 +3,7 @@ package v1
 import (
 	"net/http"
 
+	"github.com/hay-kot/content/backend/ent"
 	"github.com/hay-kot/content/backend/internal/services"
 	"github.com/hay-kot/content/backend/internal/types"
 	"github.com/hay-kot/content/backend/pkgs/server"
@@ -101,6 +102,14 @@ func (ctrl *V1Controller) HandleLocationGet() http.HandlerFunc {
 
 		location, err := ctrl.svc.Location.GetOne(r.Context(), user.GroupID, uid)
 		if err != nil {
+			if ent.IsNotFound(err) {
+				log.Err(err).
+					Str("id", uid.String()).
+					Msg("location not found")
+				server.RespondError(w, http.StatusNotFound, err)
+				return
+			}
+
 			log.Err(err).Msg("failed to get location")
 			server.RespondServerError(w)
 			return

frontend/components/Icon.vue

@@ -25,7 +25,7 @@
 </script>
 
 <template>
-  <Iconify v-if="icon" :icon="icon" class="inline-block w-5 h-5" />
+  <Iconify v-if="icon" :icon="icon" class="inline-block" />
   <Component :is="component" v-else-if="component" />
   <span v-else>{{ name }}</span>
 </template>

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

@@ -1,24 +1,8 @@
-import { describe, it, expect } from 'vitest';
+import { describe, test, expect } from 'vitest';
-import { Requests } from '../../requests';
+import { client, userClient } from './test-utils';
-import { OverrideParts } from '../base/urls';
-import { PublicApi } from '../public';
-import * as config from '../../../test/config';
-import { UserApi } from '../user';
-
-function client() {
-  OverrideParts(config.BASE_URL, '/api/v1');
-  const requests = new Requests('');
-  return new PublicApi(requests);
-}
-
-function userClient(token: string) {
-  OverrideParts(config.BASE_URL, '/api/v1');
-  const requests = new Requests('', token);
-  return new UserApi(requests);
-}
 
 describe('[GET] /api/v1/status', () => {
-  it('basic query parameter', async () => {
+  test('server should respond', async () => {
     const api = client();
     const { response, data } = await api.status();
     expect(response.status).toBe(200);
@@ -37,12 +21,12 @@ describe('first time user workflow (register, login)', () => {
     },
   };
 
-  it('user should be able to register', async () => {
+  test('user should be able to register', async () => {
     const { response } = await api.register(userData);
     expect(response.status).toBe(204);
   });
 
-  it('user should be able to login', async () => {
+  test('user should be able to login', async () => {
     const { response, data } = await api.login(userData.user.email, userData.user.password);
     expect(response.status).toBe(200);
     expect(data.token).toBeTruthy();

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

@@ -0,0 +1,57 @@
+import { expect } from 'vitest';
+import { Requests } from '../../requests';
+import { OverrideParts } from '../base/urls';
+import { PublicApi } from '../public';
+import * as config from '../../../test/config';
+import { UserApi } from '../user';
+
+export function client() {
+  OverrideParts(config.BASE_URL, '/api/v1');
+  const requests = new Requests('');
+  return new PublicApi(requests);
+}
+
+export function userClient(token: string) {
+  OverrideParts(config.BASE_URL, '/api/v1');
+  const requests = new Requests('', token);
+  return new UserApi(requests);
+}
+
+const cache = {
+  token: '',
+};
+
+/*
+ * 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> {
+  if (cache.token) {
+    return userClient(cache.token);
+  }
+  const testUser = {
+    groupName: 'test-group',
+    user: {
+      email: '__test__@__test__.com',
+      name: '__test__',
+      password: '__test__',
+    },
+  };
+
+  const api = client();
+  const { response: tryLoginResp, data } = await api.login(testUser.user.email, testUser.user.password);
+
+  if (tryLoginResp.status === 200) {
+    cache.token = data.token;
+    return userClient(cache.token);
+  }
+
+  const { response: registerResp } = await api.register(testUser);
+  expect(registerResp.status).toBe(204);
+
+  const { response: loginResp, data: loginData } = await api.login(testUser.user.email, testUser.user.password);
+  expect(loginResp.status).toBe(200);
+
+  cache.token = loginData.token;
+  return userClient(data.token);
+}

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

@@ -0,0 +1,92 @@
+import { describe, expect, test } from 'vitest';
+import { Label } from '../../classes/labels';
+import { UserApi } from '../../user';
+import { sharedUserClient } from '../test-utils';
+
+describe('locations lifecycle (create, update, delete)', () => {
+  let increment = 0;
+
+  /**
+   * 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<[Label, () => Promise<void>]> {
+    const { response, data } = await api.labels.create({
+      name: `__test__.label.name_${increment}`,
+      description: `__test__.label.description_${increment}`,
+      color: '',
+    });
+    expect(response.status).toBe(201);
+    increment++;
+
+    const cleanup = async () => {
+      const { response } = await api.labels.delete(data.id);
+      expect(response.status).toBe(204);
+    };
+    return [data, cleanup];
+  }
+
+  test('user should be able to create a label', async () => {
+    const api = await sharedUserClient();
+
+    const labelData = {
+      name: 'test-label',
+      description: 'test-description',
+      color: '',
+    };
+
+    const { response, data } = await api.labels.create(labelData);
+
+    expect(response.status).toBe(201);
+    expect(data.id).toBeTruthy();
+
+    // Ensure we can get the label
+    const { response: getResponse, data: getData } = await api.labels.get(data.id);
+
+    expect(getResponse.status).toBe(200);
+    expect(getData.id).toBe(data.id);
+    expect(getData.name).toBe(labelData.name);
+    expect(getData.description).toBe(labelData.description);
+
+    // Cleanup
+    const { response: deleteResponse } = await api.labels.delete(data.id);
+    expect(deleteResponse.status).toBe(204);
+  });
+
+  test('user should be able to update a label', async () => {
+    const api = await sharedUserClient();
+    const [label, cleanup] = await useLabel(api);
+
+    const labelData = {
+      name: 'test-label',
+      description: 'test-description',
+      color: '',
+    };
+
+    const { response, data } = await api.labels.update(label.id, labelData);
+    expect(response.status).toBe(200);
+    expect(data.id).toBe(label.id);
+
+    // Ensure we can get the label
+    const { response: getResponse, data: getData } = await api.labels.get(data.id);
+    expect(getResponse.status).toBe(200);
+    expect(getData.id).toBe(data.id);
+    expect(getData.name).toBe(labelData.name);
+    expect(getData.description).toBe(labelData.description);
+
+    // Cleanup
+    await cleanup();
+  });
+
+  test('user should be able to delete a label', async () => {
+    const api = await sharedUserClient();
+    const [label, _] = await useLabel(api);
+
+    const { response } = await api.labels.delete(label.id);
+    expect(response.status).toBe(204);
+
+    // Ensure we can't get the label
+    const { response: getResponse } = await api.labels.get(label.id);
+    expect(getResponse.status).toBe(404);
+  });
+});

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

@@ -0,0 +1,89 @@
+import { describe, expect, test } from 'vitest';
+import { Location } from '../../classes/locations';
+import { UserApi } from '../../user';
+import { sharedUserClient } from '../test-utils';
+
+describe('locations lifecycle (create, update, delete)', () => {
+  let increment = 0;
+
+  /**
+   * 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<[Location, () => Promise<void>]> {
+    const { response, data } = await api.locations.create({
+      name: `__test__.location.name_${increment}`,
+      description: `__test__.location.description_${increment}`,
+    });
+    expect(response.status).toBe(201);
+    increment++;
+
+    const cleanup = async () => {
+      const { response } = await api.locations.delete(data.id);
+      expect(response.status).toBe(204);
+    };
+
+    return [data, cleanup];
+  }
+
+  test('user should be able to create a location', async () => {
+    const api = await sharedUserClient();
+
+    const locationData = {
+      name: 'test-location',
+      description: 'test-description',
+    };
+
+    const { response, data } = await api.locations.create(locationData);
+
+    expect(response.status).toBe(201);
+    expect(data.id).toBeTruthy();
+
+    // Ensure we can get the location
+    const { response: getResponse, data: getData } = await api.locations.get(data.id);
+
+    expect(getResponse.status).toBe(200);
+    expect(getData.id).toBe(data.id);
+    expect(getData.name).toBe(locationData.name);
+    expect(getData.description).toBe(locationData.description);
+
+    // Cleanup
+    const { response: deleteResponse } = await api.locations.delete(data.id);
+    expect(deleteResponse.status).toBe(204);
+  });
+
+  test('user should be able to update a location', async () => {
+    const api = await sharedUserClient();
+    const [location, cleanup] = await useLocation(api);
+
+    const updateData = {
+      name: 'test-location-updated',
+      description: 'test-description-updated',
+    };
+
+    const { response } = await api.locations.update(location.id, updateData);
+    expect(response.status).toBe(200);
+
+    // Ensure we can get the location
+    const { response: getResponse, data } = await api.locations.get(location.id);
+    expect(getResponse.status).toBe(200);
+
+    expect(data.id).toBe(location.id);
+    expect(data.name).toBe(updateData.name);
+    expect(data.description).toBe(updateData.description);
+
+    await cleanup();
+  });
+
+  test('user should be able to delete a location', async () => {
+    const api = await sharedUserClient();
+    const [location, _] = await useLocation(api);
+
+    const { response } = await api.locations.delete(location.id);
+    expect(response.status).toBe(204);
+
+    // Ensure we can't get the location
+    const { response: getResponse } = await api.locations.get(location.id);
+    expect(getResponse.status).toBe(404);
+  });
+});

frontend/pages/index.vue

@@ -110,78 +110,106 @@
 
 <template>
   <div>
-    <header class="sm:px-6 py-2 lg:p-14 sm:py-6">
+    <div class="fill-primary min-w-full absolute top-0 z-[-1]">
-      <h2 class="mt-1 text-4xl font-bold tracking-tight text-base-content sm:text-5xl lg:text-6xl flex">
+      <div class="bg-primary flex-col flex min-h-[20vh]" />
-        HomeB
+      <svg
-        <AppLogo class="w-12 -mb-4" style="padding-left: 3px; padding-right: 2px" />
+        class="fill-primary drop-shadow-xl"
-        x
+        xmlns="http://www.w3.org/2000/svg"
-      </h2>
+        viewBox="0 0 1440 320"
-      <p class="ml-1 text-lg text-base-content/50">Track, Organize, and Manage your Shit.</p>
+        preserveAspectRatio="none"
-    </header>
+      >
-    <div class="grid p-6 sm:place-items-center min-h-[50vh]">
-      <div>
-        <Transition name="slide-fade">
-          <form v-if="registerForm" @submit.prevent="registerUser">
-            <div class="card w-max-[500px] md:w-[500px] bg-base-100 shadow-xl">
-              <div class="card-body">
-                <h2 class="card-title">Register</h2>
-                <TextField
-                  v-for="field in registerFields"
-                  v-model="field.value"
-                  :label="field.label"
-                  :key="field.label"
-                  :type="field.type"
-                />
-                <div class="card-actions justify-end">
-                  <button
-                    type="submit"
-                    class="btn btn-primary mt-2"
-                    :class="loading ? 'loading' : ''"
-                    :disabled="loading"
-                  >
-                    Register
-                  </button>
-                </div>
-              </div>
-            </div>
-          </form>
-          <form v-else @submit.prevent="login">
-            <div class="card w-max-[500px] md:w-[500px] bg-base-100 shadow-xl">
-              <div class="card-body">
-                <h2 class="card-title">Login</h2>
-                <TextField
-                  v-for="field in loginFields"
-                  v-model="field.value"
-                  :label="field.label"
-                  :key="field.label"
-                  :type="field.type"
-                />
-                <div class="card-actions justify-end mt-2">
-                  <button type="submit" class="btn btn-primary" :class="loading ? 'loading' : ''" :disabled="loading">
-                    Login
-                  </button>
-                </div>
-              </div>
-            </div>
-          </form>
-        </Transition>
-        <div class="text-center mt-4">
-          <button @click="toggleLogin" class="text-primary-content text-lg">
-            {{ registerForm ? 'Already a User? Login' : 'Not a User? Register' }}
-          </button>
-        </div>
-      </div>
-    </div>
-    <div class="min-w-full absolute bottom-0 z-[-1]">
-      <svg class="fill-primary" xmlns="http://www.w3.org/2000/svg" preserveAspectRatio="none" viewBox="0 0 1440 320">
         <path
           fill-opacity="1"
-          d="M0,32L30,42.7C60,53,120,75,180,80C240,85,300,75,360,80C420,85,480,107,540,128C600,149,660,171,720,160C780,149,840,107,900,90.7C960,75,1020,85,1080,122.7C1140,160,1200,224,1260,234.7C1320,245,1380,203,1410,181.3L1440,160L1440,320L1410,320C1380,320,1320,320,1260,320C1200,320,1140,320,1080,320C1020,320,960,320,900,320C840,320,780,320,720,320C660,320,600,320,540,320C480,320,420,320,360,320C300,320,240,320,180,320C120,320,60,320,30,320L0,320Z"
+          d="M0,32L80,69.3C160,107,320,181,480,181.3C640,181,800,107,960,117.3C1120,128,1280,224,1360,272L1440,320L1440,0L1360,0C1280,0,1120,0,960,0C800,0,640,0,480,0C320,0,160,0,80,0L0,0Z"
-        />
+        ></path>
       </svg>
-      <div class="bg-primary flex-col flex min-h-[32vh]">
+    </div>
-        <div class="mt-auto mx-auto mb-8">
+    <div>
-          <p class="text-center text-gray-200">&copy; 2022 Contents. All Rights Reserved. Haybytes LLC</p>
+      <header class="p-4 sm:px-6 lg:p-14 sm:py-6 sm:flex sm:items-end mx-auto">
+        <div>
+          <h2 class="mt-1 text-4xl font-bold tracking-tight text-neutral-content sm:text-5xl lg:text-6xl flex">
+            HomeB
+            <AppLogo class="w-12 -mb-4" style="padding-left: 3px; padding-right: 2px" />
+            x
+          </h2>
+          <p class="ml-1 text-lg text-base-content/50">Track, Organize, and Manage your Shit.</p>
+        </div>
+        <div class="flex mt-6 sm:mt-0 gap-4 ml-auto text-neutral-content">
+          <a class="tooltip" data-tip="Project Github" href="https://github.com/hay-kot/homebox" target="_blank">
+            <Icon name="mdi-github" class="h-8 w-8" />
+          </a>
+          <a href="https://twitter.com/haybytes" class="tooltip" data-tip="Follow The Developer" target="_blank">
+            <Icon name="mdi-twitter" class="h-8 w-8" />
+          </a>
+          <a href="/" class="tooltip" data-tip="Join The Discord">
+            <Icon name="mdi-discord" class="h-8 w-8" />
+          </a>
+          <a href="/" class="tooltip" data-tip="Read The Docs">
+            <Icon name="mdi-folder" class="h-8 w-8" />
+          </a>
+        </div>
+      </header>
+      <div class="grid p-6 sm:place-items-center min-h-[50vh]">
+        <div>
+          <Transition name="slide-fade">
+            <form v-if="registerForm" @submit.prevent="registerUser">
+              <div class="card w-max-[500px] md:w-[500px] bg-base-100 shadow-xl">
+                <div class="card-body">
+                  <h2 class="card-title text-2xl align-center">
+                    <Icon name="heroicons-user" class="mr-1 w-7 h-7" />
+                    Register
+                  </h2>
+                  <TextField
+                    v-for="field in registerFields"
+                    v-model="field.value"
+                    :label="field.label"
+                    :key="field.label"
+                    :type="field.type"
+                  />
+                  <div class="card-actions justify-end">
+                    <button
+                      type="submit"
+                      class="btn btn-primary mt-2"
+                      :class="loading ? 'loading' : ''"
+                      :disabled="loading"
+                    >
+                      Register
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </form>
+            <form v-else @submit.prevent="login">
+              <div class="card w-max-[500px] md:w-[500px] bg-base-100 shadow-xl">
+                <div class="card-body">
+                  <h2 class="card-title text-2xl align-center">
+                    <Icon name="heroicons-user" class="mr-1 w-7 h-7" />
+                    Login
+                  </h2>
+                  <TextField
+                    v-for="field in loginFields"
+                    v-model="field.value"
+                    :label="field.label"
+                    :key="field.label"
+                    :type="field.type"
+                  />
+                  <div class="card-actions justify-end mt-2">
+                    <button type="submit" class="btn btn-primary" :class="loading ? 'loading' : ''" :disabled="loading">
+                      Login
+                    </button>
+                  </div>
+                </div>
+              </div>
+            </form>
+          </Transition>
+          <div class="text-center mt-6">
+            <button
+              @click="toggleLogin"
+              class="text-base-content text-lg hover:bg-primary hover:text-primary-content px-3 py-1 rounded-xl transition-colors duration-200"
+            >
+              {{ registerForm ? 'Already a User? Login' : 'Not a User? Register' }}
+            </button>
+          </div>
         </div>
       </div>
     </div>