From 15dc75fce6ba38cbdbdde9e1fa4422428b7dff2d Mon Sep 17 00:00:00 2001 From: Hayden <64056131+hay-kot@users.noreply.github.com> Date: Fri, 14 Oct 2022 14:50:14 -0800 Subject: [PATCH] initial UI for currency selection --- Taskfile.yml | 1 + backend/ent/group/group.go | 5 +- backend/ent/migrate/schema.go | 2 +- backend/ent/schema/group.go | 2 +- frontend/components/Form/Select.vue | 15 ++- frontend/composables/use-preferences.ts | 32 +---- frontend/lib/data/currency.ts | 33 ++++++ frontend/lib/data/themes.ts | 150 ++++++++++++++++++++++++ frontend/pages/profile.vue | 150 +++++------------------- 9 files changed, 232 insertions(+), 158 deletions(-) create mode 100644 frontend/lib/data/currency.ts create mode 100644 frontend/lib/data/themes.ts diff --git a/Taskfile.yml b/Taskfile.yml index 6766493..e885488 100644 --- a/Taskfile.yml +++ b/Taskfile.yml @@ -27,6 +27,7 @@ tasks: - "./scripts/process-types.py" generates: - "./frontend/lib/api/types/data-contracts.ts" + - "./backend/ent/schema" - "./backend/app/api/docs/swagger.json" - "./backend/app/api/docs/swagger.yaml" diff --git a/backend/ent/group/group.go b/backend/ent/group/group.go index 7485a7e..f46cc94 100644 --- a/backend/ent/group/group.go +++ b/backend/ent/group/group.go @@ -121,6 +121,9 @@ const DefaultCurrency = CurrencyUsd // Currency values. const ( CurrencyUsd Currency = "usd" + CurrencyEur Currency = "eur" + CurrencyGbp Currency = "gbp" + CurrencyJpy Currency = "jpy" ) func (c Currency) String() string { @@ -130,7 +133,7 @@ func (c Currency) String() string { // CurrencyValidator is a validator for the "currency" field enum values. It is called by the builders before save. func CurrencyValidator(c Currency) error { switch c { - case CurrencyUsd: + case CurrencyUsd, CurrencyEur, CurrencyGbp, CurrencyJpy: return nil default: return fmt.Errorf("group: invalid enum value for currency field: %q", c) diff --git a/backend/ent/migrate/schema.go b/backend/ent/migrate/schema.go index d849a68..7954764 100644 --- a/backend/ent/migrate/schema.go +++ b/backend/ent/migrate/schema.go @@ -127,7 +127,7 @@ var ( {Name: "created_at", Type: field.TypeTime}, {Name: "updated_at", Type: field.TypeTime}, {Name: "name", Type: field.TypeString, Size: 255}, - {Name: "currency", Type: field.TypeEnum, Enums: []string{"usd"}, Default: "usd"}, + {Name: "currency", Type: field.TypeEnum, Enums: []string{"usd", "eur", "gbp", "jpy"}, Default: "usd"}, } // GroupsTable holds the schema information for the "groups" table. GroupsTable = &schema.Table{ diff --git a/backend/ent/schema/group.go b/backend/ent/schema/group.go index 01f0c1f..a9d51ed 100644 --- a/backend/ent/schema/group.go +++ b/backend/ent/schema/group.go @@ -27,7 +27,7 @@ func (Group) Fields() []ent.Field { NotEmpty(), field.Enum("currency"). Default("usd"). - Values("usd"), // TODO: add more currencies + Values("usd", "eur", "gbp", "jpy"), // TODO: add more currencies } } diff --git a/frontend/components/Form/Select.vue b/frontend/components/Form/Select.vue index 72f1d2e..5c84066 100644 --- a/frontend/components/Form/Select.vue +++ b/frontend/components/Form/Select.vue @@ -25,7 +25,7 @@ }, modelValue: { // eslint-disable-next-line @typescript-eslint/no-explicit-any - type: [Object, String, Boolean] as any, + type: [Object, String] as any, default: null, }, items: { @@ -53,10 +53,19 @@ // eslint-disable-next-line @typescript-eslint/no-explicit-any function compare(a: any, b: any): boolean { - if (props.value != null) { + if (props.value) { return a[props.value] === b[props.value]; } - return a === b; + + if (a === b) { + return true; + } + + if (!a || !b) { + return false; + } + + return JSON.stringify(a) === JSON.stringify(b); } watch( diff --git a/frontend/composables/use-preferences.ts b/frontend/composables/use-preferences.ts index 6c31fec..0ad0536 100644 --- a/frontend/composables/use-preferences.ts +++ b/frontend/composables/use-preferences.ts @@ -1,35 +1,5 @@ import { Ref } from "vue"; - -export type DaisyTheme = - | "light" - | "dark" - | "cupcake" - | "bumblebee" - | "emerald" - | "corporate" - | "synthwave" - | "retro" - | "cyberpunk" - | "valentine" - | "halloween" - | "garden" - | "forest" - | "aqua" - | "lofi" - | "pastel" - | "fantasy" - | "wireframe" - | "black" - | "luxury" - | "dracula" - | "cmyk" - | "autumn" - | "business" - | "acid" - | "lemonade" - | "night" - | "coffee" - | "winter"; +import { DaisyTheme } from "~~/lib/data/themes"; export type LocationViewPreferences = { showDetails: boolean; diff --git a/frontend/lib/data/currency.ts b/frontend/lib/data/currency.ts new file mode 100644 index 0000000..ba4fff2 --- /dev/null +++ b/frontend/lib/data/currency.ts @@ -0,0 +1,33 @@ +export type Currency = { + code: string; + local: string; + symbol: string; + name: string; +}; + +export const currencies: Currency[] = [ + { + code: "USD", + local: "en-US", + symbol: "$", + name: "US Dollar", + }, + { + code: "EUR", + local: "de-DE", + symbol: "€", + name: "Euro", + }, + { + code: "GBP", + local: "en-GB", + symbol: "£", + name: "British Pound", + }, + { + code: "JPY", + local: "ja-JP", + symbol: "¥", + name: "Japanese Yen", + }, +]; diff --git a/frontend/lib/data/themes.ts b/frontend/lib/data/themes.ts new file mode 100644 index 0000000..55f0f55 --- /dev/null +++ b/frontend/lib/data/themes.ts @@ -0,0 +1,150 @@ +export type DaisyTheme = + | "light" + | "dark" + | "cupcake" + | "bumblebee" + | "emerald" + | "corporate" + | "synthwave" + | "retro" + | "cyberpunk" + | "valentine" + | "halloween" + | "garden" + | "forest" + | "aqua" + | "lofi" + | "pastel" + | "fantasy" + | "wireframe" + | "black" + | "luxury" + | "dracula" + | "cmyk" + | "autumn" + | "business" + | "acid" + | "lemonade" + | "night" + | "coffee" + | "winter"; + +export type ThemeOption = { + label: string; + value: DaisyTheme; +}; + +export const themes: ThemeOption[] = [ + { + label: "Garden", + value: "garden", + }, + { + label: "Light", + value: "light", + }, + { + label: "Cupcake", + value: "cupcake", + }, + { + label: "Bumblebee", + value: "bumblebee", + }, + { + label: "Emerald", + value: "emerald", + }, + { + label: "Corporate", + value: "corporate", + }, + { + label: "Synthwave", + value: "synthwave", + }, + { + label: "Retro", + value: "retro", + }, + { + label: "Cyberpunk", + value: "cyberpunk", + }, + { + label: "Valentine", + value: "valentine", + }, + { + label: "Halloween", + value: "halloween", + }, + { + label: "Forest", + value: "forest", + }, + { + label: "Aqua", + value: "aqua", + }, + { + label: "Lofi", + value: "lofi", + }, + { + label: "Pastel", + value: "pastel", + }, + { + label: "Fantasy", + value: "fantasy", + }, + { + label: "Wireframe", + value: "wireframe", + }, + { + label: "Black", + value: "black", + }, + { + label: "Luxury", + value: "luxury", + }, + { + label: "Dracula", + value: "dracula", + }, + { + label: "Cmyk", + value: "cmyk", + }, + { + label: "Autumn", + value: "autumn", + }, + { + label: "Business", + value: "business", + }, + { + label: "Acid", + value: "acid", + }, + { + label: "Lemonade", + value: "lemonade", + }, + { + label: "Night", + value: "night", + }, + { + label: "Coffee", + value: "coffee", + }, + { + label: "Winter", + value: "winter", + }, +]; diff --git a/frontend/pages/profile.vue b/frontend/pages/profile.vue index ed031a2..b7279f0 100644 --- a/frontend/pages/profile.vue +++ b/frontend/pages/profile.vue @@ -1,7 +1,8 @@