sort of fixed the mini-pronoun conflict checking - but now the alerts dont work

This commit is contained in:
adueck 2022-09-23 14:17:05 +04:00
parent 6d6319e062
commit 2468c4e98b
7 changed files with 45 additions and 67 deletions

View File

@ -1,6 +1,6 @@
{
"name": "@lingdocs/pashto-inflector",
"version": "3.9.7",
"version": "3.9.8",
"author": "lingdocs.com",
"description": "A Pashto inflection and verb conjugation engine, inculding React components for displaying Pashto text, inflections, and conjugations",
"homepage": "https://verbs.lingdocs.com",

View File

@ -41,7 +41,10 @@ function EPExplorer(props: {
"EPState8",
flashMessage,
);
const [alert, setAlert] = useState<string | undefined>(undefined);
// const [
// // alertMsg,
// // setAlertMsg,
// ] = useState<string | undefined>(undefined);
const [showClipped, setShowClipped] = useState<string>("");
const parent = useRef<HTMLDivElement>(null);
useEffect(() => {
@ -62,10 +65,13 @@ function EPExplorer(props: {
adjustEps({ type: "load EPS", payload: e });
}
function flashMessage(msg: string) {
setAlert(msg);
setTimeout(() => {
setAlert(undefined);
}, 1500);
console.log(msg);
alert(msg);
// for some crazy reason using this alert functionality breaks the flow!
// setAlertMsg(msg);
// setTimeout(() => {
// setAlertMsg(undefined);
// }, 1500);
}
function flashClippedMessage(m: string) {
setShowClipped(m);
@ -133,15 +139,15 @@ function EPExplorer(props: {
eps={eps}
setOmitSubject={"eps" in props ? false : payload => adjustEps({ type: "set omitSubject", payload })}
/>}
{alert && <div className="alert alert-warning text-center" role="alert" style={{
{/* {alertMsg && <div className="alert alert-warning text-center" role="alert" style={{
position: "fixed",
top: "30%",
left: "50%",
transform: "translate(-50%, -50%)",
zIndex: 9999999999999,
}}>
{alert}
</div>}
{alertMsg}
</div>} */}
{showClipped && <div className="alert alert-primary text-center" role="alert" style={{
position: "fixed",
top: "30%",

View File

@ -4,7 +4,7 @@ import EquativePicker from "./EquativePicker";
import ButtonSelect from "../ButtonSelect";
import ComplementPicker from "../ComplementPicker";
import epsReducer, { EpsReducerAction } from "./eps-reducer";
import { useEffect, useRef, useState } from "react";
import { useEffect, useRef } from "react";
import { completeEPSelection } from "../../lib/phrase-building/render-ep";
import APPicker from "../ap-picker/APPicker";
import autoAnimate from "@formkit/auto-animate";
@ -16,18 +16,11 @@ function EPPicker({ opts, eps, onChange, entryFeeder }: {
entryFeeder: T.EntryFeeder,
}) {
const parent = useRef<HTMLDivElement>(null);
const [alert, setAlert] = useState<string | undefined>("");
useEffect(() => {
parent.current && autoAnimate(parent.current);
}, [parent]);
function adjustEps(action: EpsReducerAction) {
onChange(epsReducer(eps, action, handleAlert));
}
function handleAlert(msg: string) {
setAlert(msg);
setTimeout(() => {
setAlert(undefined);
}, 1500);
onChange(epsReducer(eps, action));
}
const phraseIsComplete = !!completeEPSelection(eps);
return <div>
@ -109,15 +102,6 @@ function EPPicker({ opts, eps, onChange, entryFeeder }: {
/>
</div>
</div>
{alert && <div className="alert alert-warning text-center" role="alert" style={{
position: "fixed",
top: "30%",
left: "50%",
transform: "translate(-50%, -50%)",
zIndex: 9999999999999,
}}>
{alert}
</div>}
</div>;
}

View File

@ -51,12 +51,18 @@ function VPExplorer(props: {
"verbExplorerMode2",
);
const [showClipped, setShowClipped] = useState<string>("");
const [alert, setAlert] = useState<string | undefined>(undefined);
const [
alertMsg,
// setAlertMsg,
] = useState<string | undefined>(undefined);
function flashMessage(msg: string) {
setAlert(msg);
setTimeout(() => {
setAlert(undefined);
}, 1500);
console.log(msg);
// for some crazy reason this causes it to go through with the state change
// we're trying to avoid when there's a potential errored state
// setAlertMsg(msg);
// setTimeout(() => {
// setAlertMsg(undefined);
// }, 2000);
}
useEffect(() => {
adjustVps({
@ -159,7 +165,7 @@ function VPExplorer(props: {
{mode === "phrases" && <VPPicker
opts={props.opts}
entryFeeder={props.entryFeeder}
onChange={(vps) => adjustVps({ type: "load vps", payload: vps })}
onChange={(payload) => adjustVps({ type: "load vps", payload })}
vps={vps}
/>}
{mode !== "phrases" && <div className="my-2">
@ -185,14 +191,14 @@ function VPExplorer(props: {
}}>
{showClipped}
</div>}
{alert && <div className="alert alert-warning text-center" role="alert" style={{
{alertMsg && <div className="alert alert-warning text-center" role="alert" style={{
position: "fixed",
top: "30%",
left: "50%",
transform: "translate(-50%, -50%)",
zIndex: 9999999999999,
}}>
{alert}
{alertMsg}
</div>}
</div>
}

View File

@ -5,7 +5,6 @@ import { useEffect, useRef, useState } from "react";
import { getKingAndServant, renderVP } from "../../lib/phrase-building/render-vp";
import { completeVPSelection, isPastTense } from "../../lib/phrase-building/vp-tools";
import VPExplorerExplanationModal, { roleIcon } from "./VPExplorerExplanationModal";
import { vpsReducer, VpsReducerAction } from "./vps-reducer";
import APPicker from "../ap-picker/APPicker";
import autoAnimate from "@formkit/auto-animate";
import {
@ -15,11 +14,12 @@ import {
isNoObject,
} from "../../lib/phrase-building/blocks-utils";
import ComplementPicker from "../ComplementPicker";
import { vpsReducer, VpsReducerAction } from "../../library";
function VPPicker({ opts, vps, onChange, entryFeeder }: {
opts: T.TextOptions,
vps: T.VPSelectionState,
onChange: (eps: T.VPSelectionState) => void,
onChange: (vps: T.VPSelectionState) => void,
entryFeeder: T.EntryFeeder,
}) {
const parent = useRef<HTMLDivElement>(null);
@ -27,16 +27,8 @@ function VPPicker({ opts, vps, onChange, entryFeeder }: {
parent.current && autoAnimate(parent.current);
}, [parent]);
const [showingExplanation, setShowingExplanation] = useState<{ role: "servant" | "king", item: "subject" | "object" } | false>(false);
const [alert, setAlert] = useState<string | undefined>(undefined);
function flashMessage(msg: string) {
setAlert(msg);
setTimeout(() => {
setAlert(undefined);
}, 1500);
}
function adjustVps(action: VpsReducerAction) {
const newVps = vpsReducer(vps, action, flashMessage);
onChange(newVps);
onChange(vpsReducer(vps, action));
}
function handleSubjectChange(subject: T.NPSelection | undefined, skipPronounConflictCheck?: boolean) {
adjustVps({
@ -207,15 +199,6 @@ function VPPicker({ opts, vps, onChange, entryFeeder }: {
showing={showingExplanation}
setShowing={setShowingExplanation}
/>
{alert && <div className="alert alert-warning text-center" role="alert" style={{
position: "fixed",
top: "30%",
left: "50%",
transform: "translate(-50%, -50%)",
zIndex: 9999999999999,
}}>
{alert}
</div>}
</div>;
}

View File

@ -80,15 +80,6 @@ export type VpsReducerAction = {
}
export function vpsReducer(vps: T.VPSelectionState, action: VpsReducerAction, sendAlert?: (msg: string) => void): T.VPSelectionState {
return ensureMiniPronounsOk(vps, doReduce());
function ensureMiniPronounsOk(old: T.VPSelectionState, vps: T.VPSelectionState): T.VPSelectionState {
const error = checkForMiniPronounsError(vps);
if (error) {
if (sendAlert) sendAlert(error);
return old;
}
return vps;
}
function doReduce(): T.VPSelectionState {
if (action.type === "load vps") {
return action.payload;
@ -319,6 +310,14 @@ export function vpsReducer(vps: T.VPSelectionState, action: VpsReducerAction, se
}
throw new Error("unknown vpsReducer state");
}
const modified = doReduce();
console.log("called once");
const err = checkForMiniPronounsError(modified);
if (err) {
if (sendAlert) sendAlert(err);
return vps;
}
return modified;
}
function hasPronounConflict(subject: T.NPSelection | undefined, object: undefined | T.VerbObject): boolean {

View File

@ -269,9 +269,9 @@ export function adjustSubjectSelection(blocks: T.VPSBlock[] | T.EPSBlock[], subj
return nb;
}
export function adjustObjectSelection(blocks: T.VPSBlock[], object: T.ObjectSelectionComplete | T.NPSelection | T.VerbObject | T.ObjectSelectionComplete): T.VPSBlockComplete[];
export function adjustObjectSelection(blocks: T.VPSBlock[], object: T.ObjectSelection | T.NPSelection | T.VerbObject | T.ObjectSelection | undefined): T.EPSBlock[];
export function adjustObjectSelection(blocks: T.VPSBlock[], object: T.ObjectSelection | T.ObjectSelectionComplete | T.VerbObject | T.NPSelection | undefined): T.VPSBlock[] | T.VPSBlockComplete[] {
export function adjustObjectSelection(blocks: Readonly<T.VPSBlock[]>, object: T.ObjectSelectionComplete | T.NPSelection | T.VerbObject | T.ObjectSelectionComplete): T.VPSBlockComplete[];
export function adjustObjectSelection(blocks: Readonly<T.VPSBlock[]>, object: T.ObjectSelection | T.NPSelection | T.VerbObject | T.ObjectSelection | undefined): T.EPSBlock[];
export function adjustObjectSelection(blocks: Readonly<T.VPSBlock[]>, object: T.ObjectSelection | T.ObjectSelectionComplete | T.VerbObject | T.NPSelection | undefined): T.VPSBlock[] | T.VPSBlockComplete[] {
const nb = [...blocks];
const i = nb.findIndex(b => b.block && b.block.type === "objectSelection");
if (i === -1) {