feat(fields): improved error messages, switched to placeholder

README.md

@@ -33,8 +33,10 @@ Requirements:
 1. Create a PostgreSQL user and database (the user should own the database).
    For example: `create user pronouns with password 'password'; create database pronouns with owner pronouns;`
 2. Copy `.env.example` in the repository root to a new file named `.env` and fill out the required options.
-3. Run `go run -v . database migrate` to initialize the database, then optionally `go run -v . database seed` to insert a test user.
+3. Copy `./frontend/.env.example` to `./frontend/env` and fill out the required options (`PUBLIC_BASE_URL`),
-4. Run `pnpm dev`. Alternatively, if you don't want the backend to live reload, run `go run -v . web`,
+   instead of using `localhost` use `127.0.0.1`.
+4. Run `go run -v . database migrate` to initialize the database, then optionally `go run -v . database seed` to insert a test user.
+5. Run `pnpm dev`. Alternatively, if you don't want the backend to live reload, run `go run -v . web`,
    then change to the `frontend/` directory and run `pnpm dev`.
 
 See [`docs/production.md`](/docs/production.md#configuration) for more information about keys in the backend and frontend `.env` files.

backend/db/field.go

@@ -43,7 +43,10 @@ func (f Field) Validate(custom CustomPreferences) string {
 		}
 
 		if !entry.Status.Valid(custom) {
-			return fmt.Sprintf("entries.%d: status is invalid", i)
+            if entry.Status == "missing" {
+                return fmt.Sprintf("didn't select a status for entries.%d. make sure to select it to the right of the field", i)
+            }
+            return fmt.Sprintf("entries.%d status: '%s' is invalid", i, entry.Status)
 		}
 	}
 

frontend/src/lib/api/entities.ts

@@ -69,7 +69,7 @@ export interface Settings {
 }
 
 export interface Field {
-  name: string;
+  name: string | null;
   entries: FieldEntry[];
 }
 

frontend/src/lib/components/edit/EditableField.svelte

@@ -36,7 +36,7 @@
 </script>
 
 <div class="p-3">
-  <h5>{field.name}</h5>
+  <h5>{field.name ? field.name : "New Field"}</h5>
   <InputGroup class="m-1">
     <IconButton
       color="secondary"
@@ -50,7 +50,7 @@
       tooltip="Move field right"
       click={() => moveField(false)}
     />
-    <Input bind:value={field.name} />
+    <Input placeholder="New Field" bind:value={field.name} />
     <Button color="danger" on:click={() => deleteField()}>Delete field</Button>
   </InputGroup>
   <hr />
@@ -65,7 +65,7 @@
     />
   {/each}
 
-  <form class="input-group m-1" on:submit={addEntry}>
+  <form class="m-1 input-group" on:submit={addEntry}>
     <input type="text" class="form-control" placeholder="New entry" bind:value={newEntry} />
     <IconButton color="success" icon="plus" tooltip="Add entry" />
   </form>

frontend/src/routes/@[username]/[memberName]/edit/fields/+page.svelte

@@ -46,7 +46,7 @@
 </div>
 <div>
   <Button
-    on:click={() => ($member.fields = [...$member.fields, { name: "New field", entries: [] }])}
+    on:click={() => ($member.fields = [...$member.fields, { name: null, entries: [] }])}
   >
     <Icon name="plus" aria-hidden /> Add new field
   </Button>

frontend/src/routes/@[username]/edit/fields/+page.svelte

@@ -45,7 +45,7 @@
   </div>
 </div>
 <div>
-  <Button on:click={() => ($user.fields = [...$user.fields, { name: "New field", entries: [] }])}>
+  <Button on:click={() => ($user.fields = [...$user.fields, { name: null, entries: [] }])}>
     <Icon name="plus" aria-hidden /> Add new field
   </Button>
 </div>