import { EmojiLaughing, HandThumbsDown, HandThumbsUp, Heart, People, Plus, Trash3, } from "react-bootstrap-icons"; import Card from "./Card"; import TextInput from "./TextInput"; import Button, { ButtonStyle } from "./Button"; import { useState } from "react"; export interface EditField { id: number; name: string; pronouns: Record; } export enum PronounChoice { favourite, okay, jokingly, friendsOnly, avoid, } type EditableCardProps = { field: EditField; onChangeName: React.ChangeEventHandler; onChangePronoun: React.ChangeEventHandler; onAddPronoun(pronoun: string): void; onDeletePronoun(e: React.MouseEvent, entry: string): void; onChangeFavourite( e: React.MouseEvent, entry: string ): void; onChangeOkay(e: React.MouseEvent, entry: string): void; onChangeJokingly(e: React.MouseEvent, entry: string): void; onChangeFriends(e: React.MouseEvent, entry: string): void; onChangeAvoid(e: React.MouseEvent, entry: string): void; onClickDelete: React.MouseEventHandler; }; export function EditableCard(props: EditableCardProps) { const [input, setInput] = useState(""); const footer = (
setInput(e.target.value)} />
); return (
    {Object.keys(props.field.pronouns).map((pronoun, index) => { const choice = props.field.pronouns[pronoun]; return (
  • ); })}
); }