export interface SaveState {
    className: string
    message: string
}

export class SaveStates {
    static readonly Guest: SaveState = {
        className: "save-state-guest",
        message: "you are not connected, your changes will not be saved.",
    }
    static readonly Ok: SaveState = {
        className: "save-state-ok",
        message: "saved",
    }
    static readonly Saving: SaveState = {
        className: "save-state-saving",
        message: "saving...",
    }
    static readonly Err: SaveState = {
        className: "save-state-error",
        message: "could not save tactic.",
    }
}

export default function SavingState({ state }: { state: SaveState }) {
    return (
        <div className={"save-state"}>
            <div className={state.className}>{state.message}</div>
        </div>
    )
}