christoph/svelte-formula11
1
Fork 0
Code Issues 23 Actions Packages Projects 1 Activity

Lib: Move dropdown options creation into library

Browse Source
This commit is contained in:
Christoph Urlacher
2025-02-03 19:35:53 +01:00
parent 49c08eeead
commit 6dd3f24d32
8 changed files with 112 additions and 118 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
src/routes/data/season/drivers/+page.svelte
View File

@ -1,6 +1,5 @@
<script lang="ts">
import { Button, type DropdownOption, type TableColumn, Table } from "$lib/components";
import { TEAM_LOGO_HEIGHT, TEAM_LOGO_WIDTH } from "$lib/config";
import { Button, type TableColumn, Table } from "$lib/components";
import { get_by_value } from "$lib/database";
import type { Driver, Team } from "$lib/schema";
import { getModalStore, type ModalSettings, type ModalStore } from "@skeletonlabs/skeleton";
@ -19,18 +18,6 @@
update_driver_team_select_values["create"] = "";
update_driver_active_values["create"] = true;
// All options to create a <Dropdown> component for the teams
const team_dropdown_options: DropdownOption[] = [];
data.teams.forEach((team: Team) => {
team_dropdown_options.push({
label: team.name,
value: team.id,
icon_url: team.logo_url,
icon_width: TEAM_LOGO_WIDTH,
icon_height: TEAM_LOGO_HEIGHT,
});
});
const drivers_columns: TableColumn[] = [
{
data_value_name: "code",
@ -70,8 +57,8 @@
component: "driverCard",
meta: {
driver: driver,
teams: data.teams,
team_select_value: update_driver_team_select_values[driver.id],
team_select_options: team_dropdown_options,
active_value: update_driver_active_values[driver.id],
disable_inputs: !data.admin,
},
@ -85,8 +72,8 @@
type: "component",
component: "driverCard",
meta: {
teams: data.teams,
team_select_value: update_driver_team_select_values["create"],
team_select_options: team_dropdown_options,
active_value: update_driver_active_values["create"],
disable_inputs: !data.admin,
require_inputs: true,

41
src/routes/data/season/substitutions/+page.svelte
View File

@ -2,14 +2,8 @@
import { get_by_value } from "$lib/database";
import { getModalStore, type ModalSettings, type ModalStore } from "@skeletonlabs/skeleton";
import type { PageData } from "./$types";
import type { Driver, Race, Substitution } from "$lib/schema";
import type { Race, Substitution } from "$lib/schema";
import { Button, Table, type DropdownOption, type TableColumn } from "$lib/components";
import {
DRIVER_HEADSHOT_HEIGHT,
DRIVER_HEADSHOT_WIDTH,
RACE_PICTOGRAM_HEIGHT,
RACE_PICTOGRAM_WIDTH,
} from "$lib/config";
let { data }: { data: PageData } = $props();
@ -27,33 +21,6 @@
update_substitution_for_select_values["create"] = "";
update_substitution_race_select_values["create"] = "";
// TODO: Duplicated code in substitutions/+page.svelte
const driver_dropdown_options: DropdownOption[] = [];
data.drivers.then((drivers: Driver[]) =>
drivers.forEach((driver: Driver) => {
driver_dropdown_options.push({
label: driver.code,
value: driver.id,
icon_url: driver.headshot_url,
icon_width: DRIVER_HEADSHOT_WIDTH,
icon_height: DRIVER_HEADSHOT_HEIGHT,
});
}),
);
const race_dropdown_options: DropdownOption[] = [];
data.races.then((races: Race[]) =>
races.forEach((race: Race) => {
race_dropdown_options.push({
label: race.name,
value: race.id,
icon_url: race.pictogram_url,
icon_width: RACE_PICTOGRAM_WIDTH,
icon_height: RACE_PICTOGRAM_HEIGHT,
});
}),
);
const substitutions_columns: TableColumn[] = [
{
data_value_name: "expand",
@ -95,11 +62,10 @@
meta: {
substitution: substitution,
drivers: await data.drivers,
races: await data.races,
substitute_select_value: update_substitution_substitute_select_values[substitution.id],
driver_select_value: update_substitution_for_select_values[substitution.id],
race_select_value: update_substitution_race_select_values[substitution.id],
driver_select_options: driver_dropdown_options,
race_select_options: race_dropdown_options,
disable_inputs: !data.admin,
},
};
@ -113,12 +79,11 @@
component: "substitutionCard",
meta: {
drivers: await data.drivers,
races: await data.races,
substitute_select_value: update_substitution_substitute_select_values["create"],
driver_select_value: update_substitution_for_select_values["create"],
disable_inputs: !data.admin,
race_select_value: update_substitution_race_select_values["create"],
driver_select_options: driver_dropdown_options,
race_select_options: race_dropdown_options,
require_inputs: true,
headshot_template:
get_by_value(data.graphics, "name", "driver_headshot_template")?.file_url ?? "Invalid",

22
src/routes/racepicks/+page.svelte
View File

@ -1,12 +1,5 @@
<script lang="ts">
import {
Button,
ChequeredFlagIcon,
Countdown,
LazyImage,
StopwatchIcon,
type DropdownOption,
} from "$lib/components";
import { ChequeredFlagIcon, Countdown, LazyImage, StopwatchIcon } from "$lib/components";
import {
Accordion,
AccordionItem,
@ -42,18 +35,6 @@
let pxx_select_value: string = $state(currentpick?.pxx ?? "");
let dnf_select_value: string = $state(currentpick?.dnf ?? "");
// TODO: Duplicated code in cards/substitutioncard.svelte
const driver_dropdown_options: DropdownOption[] = [];
data.drivers.forEach((driver: Driver) => {
driver_dropdown_options.push({
label: driver.code,
value: driver.id,
icon_url: driver.headshot_url,
icon_width: DRIVER_HEADSHOT_WIDTH,
icon_height: DRIVER_HEADSHOT_HEIGHT,
});
});
const modalStore: ModalStore = getModalStore();
const create_guess_handler = async (event: Event) => {
const modalSettings: ModalSettings = {
@ -69,7 +50,6 @@
get_by_value(data.graphics, "name", "driver_headshot_template")?.file_url ?? "Invalid",
pxx_select_value: pxx_select_value,
dnf_select_value: dnf_select_value,
driver_select_options: driver_dropdown_options,
},
};