changed abbreviation version picker - kind of an ugly implementation of the component but its all the ugliness is packed in one component

This commit is contained in:
lingdocs 2022-03-26 17:28:32 +05:00
parent 0221159dae
commit e415dd67c5
5 changed files with 137 additions and 25 deletions

View File

@ -113,6 +113,7 @@ function VerbPicker({ onChange, verb, verbs }: { verbs: VerbEntry[], verb: VerbS
/> />
<div>Tense:</div> <div>Tense:</div>
<Select <Select
isSearchable={false}
value={verb && verb.tense} value={verb && verb.tense}
// @ts-ignore // @ts-ignore
onChange={onTenseSelect} onChange={onTenseSelect}

View File

@ -0,0 +1,101 @@
import {
ButtonSelect,
} from "@lingdocs/pashto-inflector";
const options = [
{
label: "Full",
value: "full",
},
{
label: "🚫 King",
value: "noKing",
},
{
label: "👶 Servant",
value: "shrinkServant",
},
{
label: "👶 🚫 Both",
value: "shortest",
},
];
function formToValue(f: FormVersion) {
if (f.removeKing === false && f.shrinkServant === false) {
return "full";
}
if (f.removeKing === true && f.shrinkServant === false) {
return "noKing";
}
if (f.removeKing === false && f.shrinkServant === true) {
return "shrinkServant";
}
if (f.removeKing === true && f.shrinkServant === true) {
return "shortest";
}
throw new Error("unrecognized abbreviation form");
}
function limitOptions(adjustable: "both" | "king" | "servant") {
if (adjustable === "both") {
return options;
}
if (adjustable === "king") {
return options.filter(o => !["shrinkServant", "shortest"].includes(o.value));
}
if (adjustable === "servant") {
return options.filter(o => !["noKing", "shortest"].includes(o.value));
}
}
function limitValue(value: string, adjustable: "both" | "king" | "servant") {
if (adjustable === "both") return value;
if (adjustable === "king") {
return (value === "shortest")
? "noKing"
: (value === "shrinkServant")
? "full"
: value;
}
if (adjustable === "servant") {
return (value === "shortest")
? "shrinkServant"
: (value === "noKing")
? "full"
: value;
}
throw new Error("unrecognized adjustable value");
}
function AbbreviationFormSelector({ form, onChange, adjustable }: {
form: FormVersion,
onChange: (f: FormVersion) => void,
adjustable: "both" | "king" | "servant",
}) {
function handleChange(f: "full" | "noKing" | "shrinkServant" | "shortest") {
if (f === "full") {
onChange({ removeKing: false, shrinkServant: false });
} else if (f === "noKing") {
onChange({ removeKing: true, shrinkServant: false });
} else if (f === "shrinkServant") {
onChange({ removeKing: false, shrinkServant: true });
} else if (f === "shortest") {
onChange({ removeKing: true, shrinkServant: true });
}
}
// TODO: limit display of shrinking options based on the verb type
return <div className="my-3">
{/* <div className="text-center text-small mb-2">Abbreviation Options</div> */}
<ButtonSelect
// @ts-ignore
value={limitValue(formToValue(form), adjustable)}
// @ts-ignore
options={limitOptions(adjustable)}
// @ts-ignore
handleChange={handleChange}
/>
</div>
}
export default AbbreviationFormSelector;

View File

@ -5,31 +5,40 @@ import {
defaultTextOptions as opts, defaultTextOptions as opts,
Types as T, Types as T,
} from "@lingdocs/pashto-inflector"; } from "@lingdocs/pashto-inflector";
import classNames from "classnames"; import AbbreviationFormSelector from "./AbbreviationFormSelector";
import { isPastTense } from "../../lib/phrase-building/vp-tools";
function buttonClass(active: boolean, side: "l" | "r") { // function buttonClass(active: boolean, side: "l" | "r") {
return classNames( // return classNames(
"btn btn-sm btn-outline-secondary", // "btn btn-sm btn-outline-secondary",
{ active }, // { active },
{ "mr-1": side === "l" }, // { "mr-1": side === "l" },
{ "ml-1": side === "r" }, // { "ml-1": side === "r" },
); // );
} // }
function VPDisplay({ VP }: { VP: VPSelection }) { function VPDisplay({ VP }: { VP: VPSelection }) {
const [form, setForm] = useState<FormVersion>({ removeKing: false, shrinkServant: false }); const [form, setForm] = useState<FormVersion>({ removeKing: false, shrinkServant: false });
// TODO: Possibly put the servant shrinking in here after the render // TODO: Possibly put the servant shrinking in here after the render
const result = compileVP(renderVP(VP), form); const result = compileVP(renderVP(VP), form);
const servantShrinkable = VP.object && VP.object !== "none"; // const servantShrinkable = VP.object && VP.object !== "none";
const toggleForm = (f: "removeKing" | "shrinkServant") => () => { // const toggleForm = (f: "removeKing" | "shrinkServant") => () => {
setForm(oForm => ({ // setForm(oForm => ({
...oForm, // ...oForm,
[f]: !oForm[f], // [f]: !oForm[f],
})); // }));
} // }
const adjustable = VP.verb.transitivity === "transitive"
? "both"
: VP.verb.transitivity === "intransitive"
? "king"
// grammTrans
: isPastTense(VP.verb.tense)
? "servant"
: "king";
return <div className="text-center mt-2"> return <div className="text-center mt-2">
<div className="my-3"> <AbbreviationFormSelector adjustable={adjustable} form={form} onChange={setForm} />
<button {/* <button
onClick={toggleForm("removeKing")} onClick={toggleForm("removeKing")}
className={buttonClass(form.removeKing, "l")} className={buttonClass(form.removeKing, "l")}
> >
@ -40,8 +49,7 @@ function VPDisplay({ VP }: { VP: VPSelection }) {
className={buttonClass(form.shrinkServant, "r")} className={buttonClass(form.shrinkServant, "r")}
> >
👶 Servant 👶 Servant
</button>} </button>} */}
</div>
{"long" in result.ps ? {"long" in result.ps ?
<div> <div>
{/* <div className="h6">Long Verb:</div> */} {/* <div className="h6">Long Verb:</div> */}

View File

@ -15,7 +15,9 @@ import {
getLong, getLong,
} from "../text-tools"; } from "../text-tools";
import { import {
getPersonFromNP, removeBa, getPersonFromNP,
removeBa,
isPastTense,
} from "./vp-tools"; } from "./vp-tools";
import { isPattern4Entry } from "../type-predicates"; import { isPattern4Entry } from "../type-predicates";
import { hasBaParticle } from "@lingdocs/pashto-inflector/dist/lib/p-text-helpers"; import { hasBaParticle } from "@lingdocs/pashto-inflector/dist/lib/p-text-helpers";
@ -368,10 +370,6 @@ function getInf(infs: T.InflectorOutput, t: "plural" | "arabicPlural" | "inflect
return []; return [];
} }
function isPastTense(tense: VerbTense): boolean {
return tense.toLowerCase().includes("past");
}
function getKingAndServant(isPast: boolean, isTransitive: boolean): function getKingAndServant(isPast: boolean, isTransitive: boolean):
{ king: "subject", servant: "object" } | { king: "subject", servant: "object" } |
{ king: "object", servant: "subject" } | { king: "object", servant: "subject" } |

View File

@ -26,3 +26,7 @@ export function getPersonFromNP(np: NPSelection | ObjectNP): T.Person | undefine
export function removeBa(ps: T.PsString): T.PsString { export function removeBa(ps: T.PsString): T.PsString {
return psRemove(ps, concatPsString(grammarUnits.baParticle, " ")); return psRemove(ps, concatPsString(grammarUnits.baParticle, " "));
} }
export function isPastTense(tense: VerbTense): boolean {
return tense.toLowerCase().includes("past");
}