feat: working buttons in EditMe

This commit is contained in:
Sam 2022-06-06 15:27:06 +02:00
parent afb241232b
commit 6e05d266a6
1 changed files with 33 additions and 14 deletions

View File

@ -20,10 +20,6 @@ import Loading from "../lib/Loading";
import Card from "../lib/Card"; import Card from "../lib/Card";
import TextInput from "../lib/TextInput"; import TextInput from "../lib/TextInput";
interface FieldWithID extends Field {
id: number;
}
interface EditField { interface EditField {
id: number; id: number;
name: string; name: string;
@ -113,11 +109,26 @@ export default function EditMe() {
field.name = e.target.value; field.name = e.target.value;
setFields([...fields]); setFields([...fields]);
}} }}
onChangeFavourite={null} onChangeFavourite={(e, entry: string) => {
onChangeOkay={null} field.pronouns[entry] = PronounChoice.favourite;
onChangeJokingly={null} setFields([...fields]);
onChangeFriends={null} }}
onChangeAvoid={null} onChangeOkay={(e, entry: string) => {
field.pronouns[entry] = PronounChoice.okay;
setFields([...fields]);
}}
onChangeJokingly={(e, entry: string) => {
field.pronouns[entry] = PronounChoice.jokingly;
setFields([...fields]);
}}
onChangeFriends={(e, entry: string) => {
field.pronouns[entry] = PronounChoice.friendsOnly;
setFields([...fields]);
}}
onChangeAvoid={(e, entry: string) => {
field.pronouns[entry] = PronounChoice.avoid;
setFields([...fields]);
}}
onClickDelete={(_) => { onClickDelete={(_) => {
const newFields = [...fields]; const newFields = [...fields];
newFields.splice(i, 1); newFields.splice(i, 1);
@ -133,11 +144,14 @@ export default function EditMe() {
type EditableCardProps = { type EditableCardProps = {
field: EditField; field: EditField;
onChangeName: React.ChangeEventHandler<HTMLInputElement>; onChangeName: React.ChangeEventHandler<HTMLInputElement>;
onChangeFavourite: any; onChangeFavourite(
onChangeOkay: any; e: React.MouseEvent<HTMLButtonElement>,
onChangeJokingly: any; entry: string
onChangeFriends: any; ): void;
onChangeAvoid: any; onChangeOkay(e: React.MouseEvent<HTMLButtonElement>, entry: string): void;
onChangeJokingly(e: React.MouseEvent<HTMLButtonElement>, entry: string): void;
onChangeFriends(e: React.MouseEvent<HTMLButtonElement>, entry: string): void;
onChangeAvoid(e: React.MouseEvent<HTMLButtonElement>, entry: string): void;
onClickDelete: React.MouseEventHandler<HTMLButtonElement>; onClickDelete: React.MouseEventHandler<HTMLButtonElement>;
}; };
@ -167,6 +181,7 @@ function EditableCard(props: EditableCardProps) {
<div className="rounded-md"> <div className="rounded-md">
<button <button
type="button" type="button"
onClick={(e) => props.onChangeFavourite(e, pronoun)}
className={`${ className={`${
choice == PronounChoice.favourite choice == PronounChoice.favourite
? "bg-slate-500" ? "bg-slate-500"
@ -177,6 +192,7 @@ function EditableCard(props: EditableCardProps) {
</button> </button>
<button <button
type="button" type="button"
onClick={(e) => props.onChangeOkay(e, pronoun)}
className={`${ className={`${
choice == PronounChoice.okay choice == PronounChoice.okay
? "bg-slate-500" ? "bg-slate-500"
@ -187,6 +203,7 @@ function EditableCard(props: EditableCardProps) {
</button> </button>
<button <button
type="button" type="button"
onClick={(e) => props.onChangeJokingly(e, pronoun)}
className={`${ className={`${
choice == PronounChoice.jokingly choice == PronounChoice.jokingly
? "bg-slate-500" ? "bg-slate-500"
@ -197,6 +214,7 @@ function EditableCard(props: EditableCardProps) {
</button> </button>
<button <button
type="button" type="button"
onClick={(e) => props.onChangeFriends(e, pronoun)}
className={`${ className={`${
choice == PronounChoice.friendsOnly choice == PronounChoice.friendsOnly
? "bg-slate-500" ? "bg-slate-500"
@ -207,6 +225,7 @@ function EditableCard(props: EditableCardProps) {
</button> </button>
<button <button
type="button" type="button"
onClick={(e) => props.onChangeAvoid(e, pronoun)}
className={`${ className={`${
choice == PronounChoice.avoid choice == PronounChoice.avoid
? "bg-slate-500" ? "bg-slate-500"