diff --git a/frontend/src/components/configCommon.tsx b/frontend/src/components/configCommon.tsx index 9deab6a..7b96f84 100644 --- a/frontend/src/components/configCommon.tsx +++ b/frontend/src/components/configCommon.tsx @@ -28,12 +28,15 @@ export function CommonFields({ { updateConfig({ ...config, eventSimilarity: value }); }} @@ -42,12 +45,13 @@ export function CommonFields({ { updateConfig({ ...config, numTickets: value }); }} @@ -56,12 +60,15 @@ export function CommonFields({ { updateConfig({ ...config, maxTicketPrice: value }); }} @@ -70,12 +77,15 @@ export function CommonFields({ { updateConfig({ ...config, discount: value }); }} diff --git a/frontend/src/components/configField.tsx b/frontend/src/components/configField.tsx index 4a8602f..710695e 100644 --- a/frontend/src/components/configField.tsx +++ b/frontend/src/components/configField.tsx @@ -7,44 +7,45 @@ import { NumericFormat } from "react-number-format"; interface ConfigFieldProps { label: string; description: string; - placeholder?: string; type: "text" | "number" | "integer" | "fraction" | "percentage" | "price"; value?: T; - globalFallbackValue?: T; - withGlobalFallback?: boolean; - showReset?: boolean; + showReset?: boolean; // Whether to show reset button + resetValue?: T; // Value to set when reset is clicked + defaultValuePlaceholder?: string; // Placeholder to use when field will use the default value (i.e. reset) + showGlobalReset?: boolean; // Whether to show global reset button. Should only be true if field is not a global field + globalValuePlaceholder?: string; // Placeholder to use when field will use the global value (i.e. global reset) updateValue: (newValue?: T) => void; } export function ConfigField({ label, description, - placeholder, type, value, - withGlobalFallback = false, - globalFallbackValue = undefined, + resetValue, + globalValuePlaceholder, + defaultValuePlaceholder, showReset = true, + showGlobalReset = false, updateValue, }: ConfigFieldProps) { - // Determine the field value to display let fieldValue = value; + + // Determine whether value means field will use global/default + // value, and there the placeholder to use. let isLinkedToGlobal = false; - if (fieldValue === undefined && withGlobalFallback) { - // If no value is set, and we want to use global fallback - fieldValue = globalFallbackValue; + let placeholder = ""; + if (showGlobalReset && fieldValue === undefined) { + placeholder = `${globalValuePlaceholder} (Global)`; isLinkedToGlobal = true; - } else if (typeof fieldValue === "number" && fieldValue < 0) { - // If value is negative number, set undefined to show placeholder - fieldValue = undefined; - } - - // Determine the reset value based on type - let resetValue: T; - if (type === "text") { - resetValue = "" as T; - } else { - resetValue = -1 as T; + } else if ( + showReset && + (fieldValue === undefined || + (typeof fieldValue === "string" && fieldValue === "") || + (typeof fieldValue === "number" && fieldValue < 0)) + ) { + placeholder = `${defaultValuePlaceholder} (Default)`; + fieldValue = undefined; // Unset value so placeholder is shown } const renderInput = () => { @@ -93,13 +94,13 @@ export function ConfigField({
- {withGlobalFallback && ( + {showGlobalReset && ( )}
- {withGlobalFallback && ( + {showGlobalReset && ( {