logic when POS not supported and some additions

src/components/dictionary/Paradigm.tsx

@@ -35,57 +35,42 @@ const Paradigm: React.FC<ParadigmProps> = ({ head, lang, mode, onLoaded }) => {
 
   useEffect(() => {
     if (!plugin) return;
-
     let isMounted = true;
     const cancelers: CancelTokenSource[] = [];
-
     const raw = plugin.addParadigms({ head, mode, locale, t, apyFetch });
-
     if (!Array.isArray(raw)) {
       setBlocks([]);
       setLoading(false);
       return;
     }
-
-    const rawBlocks = raw;
-    setBlocks(rawBlocks);
-
+    setBlocks(raw);
     const lemma = head.replace(/<[^>]+>/g, '');
     const origTags = Array.from(head.matchAll(/<([^>]+)>/g), (m) => m[1]);
-
-    const fetchCells = rawBlocks
+    const fetchCells = raw
       .flatMap((b) => b.subcats ?? [b])
       .flatMap((b) => b.tabdata ?? [])
       .flat();
-
-    if (fetchCells.length === 0) {
+    if (!fetchCells.length) {
       if (isMounted) {
         setLoading(false);
         onLoaded?.();
       }
       return;
     }
-
     const out: Record<string, string> = {};
-
     Promise.all(
       fetchCells.map(async (cell) => {
         if (!cell.tags) return;
         const seq = plugin.parseTags(origTags, cell.tags);
         const pattern = '^' + lemma + seq.map((x) => `<${x}>`).join('') + '$';
-        const [ctr, req] = apyFetch('generate', {
-          lang: plugin.backendLangCode,
-          q: pattern,
-        });
+        const [ctr, req] = apyFetch('generate', { lang: plugin.backendLangCode, q: pattern });
         cancelers.push(ctr);
         try {
           const data = (await req).data as Array<[string, string]>;
           if (data.length && !data[0][0].startsWith('#')) {
             out[cell.tags] = data[0][0];
           }
-        } catch (err) {
-          if (!axios.isCancel(err)) console.error(err);
-        }
+        } catch {}
       }),
     ).then(() => {
       if (isMounted) {
@@ -94,26 +79,20 @@ const Paradigm: React.FC<ParadigmProps> = ({ head, lang, mode, onLoaded }) => {
         onLoaded?.();
       }
     });
-
     return () => {
       isMounted = false;
       cancelers.forEach((c) => c.cancel());
     };
   }, [head, lang, locale, mode, t, apyFetch, plugin, onLoaded]);
 
-  if (!plugin) {
-    return <div className="text-center text-muted my-4">{t('No_paradigms_for_language', { lang })}</div>;
-  }
-  if (loading) {
-    return <Spinner animation="border" role="status" />;
-  }
-  if (blocks.length === 0) {
+  if (!plugin) return <div className="text-center text-muted my-4">{t('No_paradigms_for_language', { lang })}</div>;
+  if (loading) return <Spinner animation="border" role="status" />;
+  if (!blocks.length)
     return (
       <div className="text-center text-muted my-2" data-testid="no-paradigm-found">
         {t('No_pos_found')}
       </div>
     );
-  }
 
   return (
     <div className="paradigm-container">
@@ -125,7 +104,6 @@ const Paradigm: React.FC<ParadigmProps> = ({ head, lang, mode, onLoaded }) => {
               {block.subcats.map((sub, j) => (
                 <div key={j} id={sub.id}>
                   <h5>{t(sub.label())}</h5>
-
                   {sub.tablist ? (
                     <ul>
                       {sub.tablist.map((item, k) => (
@@ -157,15 +135,13 @@ const Paradigm: React.FC<ParadigmProps> = ({ head, lang, mode, onLoaded }) => {
                       </tbody>
                     </table>
                   )}
-
                   {sub.info && <div className="text-info">{t(sub.info)}</div>}
                 </div>
               ))}
             </>
           ) : (
             <div id={block.id}>
               <h5>{t(block.label())}</h5>
-
               {block.tablist ? (
                 <ul>
                   {block.tablist.map((item, k) => (
@@ -197,7 +173,6 @@ const Paradigm: React.FC<ParadigmProps> = ({ head, lang, mode, onLoaded }) => {
                   </tbody>
                 </table>
               )}
-
               {block.info && <div className="text-info">{t(block.info)}</div>}
             </div>
           )}

src/components/dictionary/Word.tsx

@@ -1,4 +1,4 @@
-import React, { useState, useEffect } from 'react';
+import React, { useState, useEffect, useContext } from 'react';
 import './Word.css';
 import { useLocalizationPOS } from '../../util/localization';
 import { getPosTag } from '../../util/posLocalization';
@@ -8,6 +8,7 @@ import Dropdown from 'react-bootstrap/Dropdown';
 import Paradigm from './Paradigm';
 import { uumLabels } from './langs/uum';
 import { languageRegistry } from './index';
+import { APyContext } from '../../context';
 
 export interface WordProps {
   head: string;
@@ -19,29 +20,29 @@ export interface WordProps {
 const Word: React.FC<WordProps> = ({ head, definitions, lang, onDefinitionClick }) => {
   const { locale } = useLocalizationPOS();
   const { t } = useLocalization();
+  const apyFetch = useContext(APyContext);
   const [expanded, setExpanded] = useState(false);
   const [loadingParadigm, setLoadingParadigm] = useState(false);
 
   const plugin = languageRegistry[lang];
   const code = locale.split('-')[0].toLowerCase();
   const availableModes = Object.keys(uumLabels[code] || {}) as string[];
-  const [mode, setMode] = useState<string>(availableModes.length > 0 ? availableModes[0] : 'Linguist');
+  const [mode, setMode] = useState<string>(availableModes[0] || '');
 
   useEffect(() => {
-    if (!availableModes.includes(mode)) {
-      setMode(availableModes[0] || 'Linguist');
+    if (availableModes.length && !availableModes.includes(mode)) {
+      setMode(availableModes[0]);
     }
   }, [locale, availableModes]);
 
   const tagRe = /<([^>]+)>/g;
   const tags: string[] = [];
   let m: RegExpExecArray | null;
-  while ((m = tagRe.exec(head))) {
-    tags.push(m[1]);
-  }
+  while ((m = tagRe.exec(head))) tags.push(m[1]);
+
   const word = head.replace(/<[^>]+>/g, '');
   const cleanDefs = definitions.map((def) => def.replace(/<[^>]+>/g, '')).filter((def) => !/^\(.*\)$/.test(def));
-  const displayTag = tags.length > 0 ? getPosTag(locale, tags.join('.')) : null;
+  const displayTag = tags.length ? getPosTag(locale, tags.join('.')) : null;
 
   const handleToggle = () => {
     if (!expanded) {
@@ -52,23 +53,24 @@ const Word: React.FC<WordProps> = ({ head, definitions, lang, onDefinitionClick
     }
   };
 
-  const showExpand = Boolean(plugin && availableModes.length > 0);
+  const rawBlocks = plugin ? plugin.addParadigms({ head, mode, locale, t, apyFetch }) : [];
+  const hasParadigms = Array.isArray(rawBlocks) && rawBlocks.length > 0;
+  const showExpand = hasParadigms;
+  const showDropdown = hasParadigms && availableModes.length > 1;
 
   return (
     <div className="word-card">
       <div className="word-header">
         <span className="word-text">{word}</span>
         {displayTag && <span className="word-pos">{displayTag}</span>}
       </div>
-
       <ol className="word-definitions">
         {cleanDefs.map((def, i) => (
           <li key={i} className="definition-item" onClick={() => onDefinitionClick?.(def, i)}>
             {def}
           </li>
         ))}
       </ol>
-
       {showExpand && (
         <div className="expand-controls">
           <button type="button" className="expand-button" onClick={handleToggle} disabled={loadingParadigm}>
@@ -83,24 +85,22 @@ const Word: React.FC<WordProps> = ({ head, definitions, lang, onDefinitionClick
               t('Expand_Paradigms')
             )}
           </button>
-
-          {expanded && (
-            <Dropdown onSelect={(eventKey) => typeof eventKey === 'string' && setMode(eventKey)}>
+          {showDropdown && expanded && (
+            <Dropdown onSelect={(key) => typeof key === 'string' && setMode(key)}>
               <Dropdown.Toggle id="mode-dropdown" className="expand-button">
                 {mode}
               </Dropdown.Toggle>
               <Dropdown.Menu>
-                {availableModes.map((mKey) => (
-                  <Dropdown.Item key={mKey} eventKey={mKey}>
-                    {mKey}
+                {availableModes.map((mk) => (
+                  <Dropdown.Item key={mk} eventKey={mk}>
+                    {mk}
                   </Dropdown.Item>
                 ))}
               </Dropdown.Menu>
             </Dropdown>
           )}
         </div>
       )}
-
       {showExpand && expanded && (
         <div className="word-paradigm">
           <Paradigm head={head} lang={lang} mode={mode} onLoaded={() => setLoadingParadigm(false)} />

src/components/dictionary/langs/uum.ts

@@ -16,15 +16,6 @@ export interface UumLabels {
   'poss-pl': Record<string, string>;
 }
 
-export type UumBlock = {
-  id?: string;
-  label: () => string;
-  tabcols?: string[];
-  tabrows?: string[];
-  tabdata?: Array<Array<{ tags: string }>>;
-  subcats?: UumBlock[];
-};
-
 export const uumLabels: Record<string, Record<string, UumLabels>> = {
   eng: {
     Linguist: {
@@ -137,7 +128,6 @@ export const uumLabels: Record<string, Record<string, UumLabels>> = {
       },
     },
   },
-
   ukr: {
     'Лінгвіст': {
       sg: 'Однина',
@@ -249,7 +239,6 @@ export const uumLabels: Record<string, Record<string, UumLabels>> = {
       },
     },
   },
-
   deu: {
     'Sprachwissenschaftler': {
       sg: 'Singular',
@@ -394,7 +383,7 @@ function add_uum(
         [{ tags: `${tgs}.p3.sg` }],
         [{ tags: `${tgs}.p3.pl` }],
       ].map((row, i) => [row[0], { tags: `neg.${row[0].tags}` }]),
-    };
+    }
   }
 
   const mkImpRows = () =>
@@ -415,9 +404,7 @@ function add_uum(
         id: 'non-personal',
         label: () => t(m.labels['non-personal']),
         tabcols: [m.labels.affirmative, m.labels.negative].map(k => t(k)),
-        tabrows: [m.labels.infinitive, m.labels.participle, m.labels.converb].map(k =>
-          t(k)
-        ),
+        tabrows: [m.labels.infinitive, m.labels.participle, m.labels.converb].map(k => t(k)),
         tabdata: [
           [{ tags: 'inf' }],
           [{ tags: 'pp' }],
@@ -449,9 +436,7 @@ function add_uum(
         id: 'non-personal',
         label: () => t(m.labels['non-personal']),
         tabcols: [m.labels.affirmative, m.labels.negative].map(k => t(k)),
-        tabrows: [m.labels.infinitive, m.labels.participle, m.labels.converb].map(k =>
-          t(k)
-        ),
+        tabrows: [m.labels.infinitive, m.labels.participle, m.labels.converb].map(k => t(k)),
         tabdata: [
           [{ tags: 'inf' }],
           [{ tags: 'pp' }],
@@ -499,9 +484,7 @@ function add_uum(
             tabcols: Object.values(m['poss-sg']).map(k => t(k)),
             tabrows: Object.values(m.cases).map(k => t(k)),
             tabdata: Object.keys(m.cases).map(c =>
-              Object.keys(m['poss-sg']).map(p => ({
-                tags: `px${p.slice(1)}.${c}`,
-              }))
+              Object.keys(m['poss-sg']).map(p => ({ tags: `px${p.slice(1)}.${c}` }))
             ),
           },
           {
@@ -510,9 +493,7 @@ function add_uum(
             tabcols: Object.values(m['poss-pl']).map(k => t(k)),
             tabrows: Object.values(m.cases).map(k => t(k)),
             tabdata: Object.keys(m.cases).map(c =>
-              Object.keys(m['poss-pl']).map(p => ({
-                tags: `pl.px${p.slice(1)}.${c}`,
-              }))
+              Object.keys(m['poss-pl']).map(p => ({ tags: `pl.px${p.slice(1)}.${c}` }))
             ),
           },
         ],
@@ -540,9 +521,7 @@ function add_uum(
             tabcols: Object.values(m['poss-sg']).map(k => t(k)),
             tabrows: Object.values(m.cases).map(k => t(k)),
             tabdata: Object.keys(m.cases).map(c =>
-              Object.keys(m['poss-sg']).map(p => ({
-                tags: `px${p.slice(1)}.${c}`,
-              }))
+              Object.keys(m['poss-sg']).map(p => ({ tags: `px${p.slice(1)}.${c}` }))
             ),
           },
           {
@@ -551,15 +530,13 @@ function add_uum(
             tabcols: Object.values(m['poss-pl']).map(k => t(k)),
             tabrows: Object.values(m.cases).map(k => t(k)),
             tabdata: Object.keys(m.cases).map(c =>
-              Object.keys(m['poss-pl']).map(p => ({
-                tags: `pl.px${p.slice(1)}.${c}`,
-              }))
+              Object.keys(m['poss-pl']).map(p => ({ tags: `pl.px${p.slice(1)}.${c}` }))
             ),
           },
         ],
       },
     ],
-  };
+  }
 }
 
 export function parseTags(origTags: string[], cellTags: string): string[] {
@@ -580,13 +557,14 @@ export const uumPlugin: LanguagePlugin = {
     const labelsForMode = uumLabels[code]?.[mode] ?? uumLabels.eng.Linguist;
     const blocksMap = add_uum({ labels: labelsForMode, t });
     const origTags = Array.from(head.matchAll(/<([^>]+)>/g), (m) => m[1]);
-    let key: string;
+    let key: string | undefined;
     if (origTags.includes('iv')) key = 'verb_iv';
     else if (origTags.includes('tv')) key = 'verb_tv';
     else if (origTags.some((tag) => tag.startsWith('v'))) key = 'vaux';
     else if (origTags.some((tag) => tag.startsWith('np.'))) key = 'pnoun';
-    else key = 'noun';
+    else if (origTags[0] === 'n') key = 'noun';
+    if (!key) return [];
     return blocksMap[key] || [];
   },
   parseTags,
-};
+};