// a discriminant field narrows the allowed shape
type AlertProps =
  | { kind: "info"; message: string }
  | { kind: "error"; message: string; code: number };

function Alert(props: AlertProps) {
  if (props.kind === "error") {
    return <p>Error {props.code}: {props.message}</p>;
  }
  return <p>{props.message}</p>;
}

export default Alert;

model variant props with a tagged union