Blorg-Frontend/src/components/AccountDefaultSetting.tsx

43 lines
1.3 KiB
TypeScript

import * as React from "react";
import { Link } from "react-router-dom";
interface Props {
settingField: string;
settingValue: string;
changedSettingsHook: object;
}
function handleSettingFieldChange(eventData, setFunction, changedSettingsHook, initialValue, settingField) {
setFunction(eventData.target.value);
if (eventData.target.value === initialValue) {
let removeSettingObject = changedSettingsHook.changedSettings
delete removeSettingObject[settingField];
changedSettingsHook.setChangedSettings(() => ({...removeSettingObject}));
} else {
changedSettingsHook.setChangedSettings(() => ({...changedSettingsHook.changedSettings, [settingField]: eventData.target.value}));
}
}
export default function AccountDefaultSetting({
settingField,
settingValue,
changedSettingsHook,
}: Props) {
const initialValue = settingValue;
const [fieldValue, setFieldValue] = React.useState(settingValue);
return (
<>
<h4 key={settingField + "Header"}>{settingField + ":"}</h4>
<input
type="text"
key={settingField + "Body"}
name={settingField}
value={fieldValue}
onChange={(eventData) =>
handleSettingFieldChange(eventData, setFieldValue, changedSettingsHook, initialValue, settingField)
}
></input>
</>
);
}