CloudHost/LingvAI
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Translation swap added

Browse Source
This commit is contained in:
David
2021-03-18 23:47:12 +01:00
parent 535f791455
commit 2bc931a4d3
7 changed files with 107 additions and 50 deletions
Download Patch File Download Diff File Expand all files Collapse all files

31
pages/[[...slug]].tsx
View File

@@ -9,9 +9,8 @@ import { googleScrape, extractSlug } from "../utils/translate";
import { retrieveFiltered } from "../utils/language";
import langReducer, { Actions, initialState } from "../utils/reducer";
const Page: FC<InferGetStaticPropsType<typeof getStaticProps>> = ({ translation, statusCode, errorMsg, initial }) => {
const [{ source, target, query }, dispatch] = useReducer(langReducer, initialState);
const [delayedQuery, setDelayedQuery] = useState(initialState.query);
const Page: FC<InferGetStaticPropsType<typeof getStaticProps>> = ({ home, translationRes, statusCode, errorMsg, initial }) => {
const [{ source, target, query, delayedQuery, translation }, dispatch] = useReducer(langReducer, initialState);
const handleChange = (e: ChangeEvent<HTMLTextAreaElement | HTMLSelectElement>) => {
dispatch({
@@ -24,23 +23,27 @@ const Page: FC<InferGetStaticPropsType<typeof getStaticProps>> = ({ translation,
};
useEffect(() => {
initial && dispatch({ type: Actions.SET_ALL, payload: { state: initial }});
}, [initial]);
const state = { ...initial, delayedQuery: initial?.query, translation: translationRes };
initial && dispatch({ type: Actions.SET_ALL, payload: { state }});
}, [initial, translationRes]);
useEffect(() => {
const timeout = setTimeout(() => setDelayedQuery(query), 1000);
const timeout = setTimeout(() =>
dispatch({ type: Actions.SET_FIELD, payload: { key: "delayedQuery", value: query }}
), 1000);
return () => clearTimeout(timeout);
}, [query]);
useEffect(() => {
const queryIsEmpty = !delayedQuery || delayedQuery === initialState.query;
const queryIsInitial = delayedQuery === initial?.query;
const sourceIsInitial = source === initialState.source || source === initial?.source;
const targetIsInitial = target === initialState.target || target === initial?.target;
const allAreInitials = queryIsInitial && sourceIsInitial && targetIsInitial;
if (!delayedQuery || delayedQuery === initialState.query)
return;
if (!home && !initial)
return;
if (!home && delayedQuery === initial.query && source === initial.source && target === initial.target)
return;
queryIsEmpty || allAreInitials || Router.push(`/${source}/${target}/${encodeURIComponent(delayedQuery)}`);
}, [source, target, delayedQuery, initial]);
Router.push(`/${source}/${target}/${encodeURIComponent(delayedQuery)}`);
}, [source, target, delayedQuery, initial, home]);
const { sourceLangs, targetLangs } = retrieveFiltered(source, target);
@@ -115,7 +118,7 @@ export const getStaticPaths: GetStaticPaths = async () => ({
export const getStaticProps: GetStaticProps = async ({ params }) => {
if (!params?.slug || !Array.isArray(params.slug))
return {
props: {}
props: { home: true }
};
const { source, target, query } = extractSlug(params.slug);