Move runic parsing to build step

Saves resources as runes lib doesn't have to be shipped to client side at all.
stscoundrel · Oct 26, 2024 · 2fab492 · 2fab492
1 parent 87650b3
commit 2fab492
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 4 deletions.
diff --git a/src/components/WordDefinition/WordDefinition.test.tsx b/src/components/WordDefinition/WordDefinition.test.tsx
@@ -55,6 +55,8 @@ const crosslinks = [
   },
 ]
 
+const runes = 'ᛅᚠ-ᛒᚢᚱᚦᚱ'
+
 describe('WordDefinition component', () => {
   test('Does not crash', () => {
     const div = document.createElement('div')
@@ -65,6 +67,7 @@ describe('WordDefinition component', () => {
         abbreviations={abbreviations}
         similarEntries={[]}
         crosslinks={crosslinks}
+        runes={runes}
       />,
     )
   })
@@ -76,6 +79,7 @@ describe('WordDefinition component', () => {
         abbreviations={abbreviations}
         similarEntries={[]}
         crosslinks={crosslinks}
+        runes={runes}
       />,
     ).toJSON()
     expect(tree).toMatchSnapshot()
@@ -88,6 +92,7 @@ describe('WordDefinition component', () => {
         similarEntries={[]}
         abbreviations={abbreviations}
         crosslinks={crosslinks}
+        runes="ᚢᚱ-ᚢᛅᚾᛅ"
       />,
     ).toJSON()
     expect(tree).toMatchSnapshot()
@@ -100,6 +105,7 @@ describe('WordDefinition component', () => {
         abbreviations={abbreviations}
         similarEntries={[]}
         crosslinks={crosslinks}
+        runes={runes}
       />,
     )
     const { root } = tree
@@ -114,6 +120,7 @@ describe('WordDefinition component', () => {
         abbreviations={abbreviations}
         similarEntries={[]}
         crosslinks={crosslinks}
+        runes={runes}
       />,
     )
     const { root } = tree

diff --git a/src/components/WordDefinition/index.tsx b/src/components/WordDefinition/index.tsx
@@ -1,4 +1,3 @@
-import { youngerFuthark } from 'riimut'
 import type { Crosslink } from 'scandinavian-dictionary-crosslinker'
 import { capitalize, getOlderSpelling } from 'lib/utils/strings'
 import { addAbbreviationsToContent, type CombinedAbbreviations } from 'lib/services/abbreviations'
@@ -13,10 +12,11 @@ interface WordDefinitionProps{
   similarEntries: DictionaryEntry[],
   abbreviations: CombinedAbbreviations,
   crosslinks: Crosslink[],
+  runes: string,
 }
 
 export default function WordDefinition({
-  entry, similarEntries, abbreviations, crosslinks,
+  entry, similarEntries, abbreviations, crosslinks, runes,
 }: WordDefinitionProps) {
   const { word, definitions } = entry
   const olderForm = getOlderSpelling(word)
@@ -57,7 +57,7 @@ export default function WordDefinition({
         </p>}
 
       <p>Possible runic inscription in <em>Younger Futhark</em>:
-        <span className={styles.rune}>{ youngerFuthark.lettersToRunes(word) }</span><br />
+        <span className={styles.rune}>{ runes }</span><br />
       <small>Younger Futhark runes were used from 8th to 12th centuries
         in Scandinavia and their overseas settlements</small>
       </p>

diff --git a/src/pages/word/[word].tsx b/src/pages/word/[word].tsx
@@ -17,6 +17,7 @@ import WordDefinition from 'components/WordDefinition'
 import Button from 'components/Button'
 import { decodeLetter } from 'lib/utils/slugs'
 import { getCrossLinks } from 'lib/services/crosslinks'
+import { youngerFuthark } from 'riimut'
 
 interface WordPageProps{
   entry: DictionaryEntry,
@@ -25,6 +26,7 @@ interface WordPageProps{
   letter: AlphabetLetter,
   abbreviations: CombinedAbbreviations,
   crosslinks: Crosslink[],
+  runes: string,
 }
 
 interface WordPageParams{
@@ -88,6 +90,7 @@ export async function getStaticProps(
   )[0]
   const abbreviations = getAbbreviations(entry)
   const crosslinks = getCrossLinks(entry)
+  const runes = youngerFuthark.lettersToRunes(entry.word)
 
   return {
     props: {
@@ -97,12 +100,13 @@ export async function getStaticProps(
       letters,
       abbreviations,
       crosslinks,
+      runes,
     },
   }
 }
 
 export default function Word({
-  entry, similarEntries, letters, abbreviations, crosslinks,
+  entry, similarEntries, letters, abbreviations, crosslinks, runes,
 }) {
   const router = useRouter()
 
@@ -117,6 +121,7 @@ export default function Word({
         similarEntries={similarEntries}
         abbreviations={abbreviations}
         crosslinks={crosslinks}
+        runes={runes}
       />
       <Button text="Back" action={() => router.back()} />
     </Layout>

diff --git a/tests/unit/pages/word.test.tsx b/tests/unit/pages/word.test.tsx
@@ -59,6 +59,8 @@ describe('Word page: render & usage', () => {
     },
   ]
 
+  const runes = 'ᚢᚢᛚᚢᛅ'
+
   test('Does not crash', () => {
     const div = document.createElement('div')
     const root = ReactDOM.createRoot(div)
@@ -69,6 +71,7 @@ describe('Word page: render & usage', () => {
         letters={getAlphabet()}
         abbreviations={abbreviations}
         crosslinks={crosslinks}
+        runes={runes}
       />,
     )
   })
@@ -81,6 +84,7 @@ describe('Word page: render & usage', () => {
         letters={getAlphabet()}
         abbreviations={abbreviations}
         crosslinks={crosslinks}
+        runes={runes}
       />,
     ).toJSON()
     expect(tree).toMatchSnapshot()
@@ -94,6 +98,7 @@ describe('Word page: render & usage', () => {
         letters={getAlphabet()}
         abbreviations={abbreviations}
         crosslinks={[]}
+        runes={runes}
       />,
     ).toJSON()
     expect(tree).toBeNull()
@@ -107,6 +112,7 @@ describe('Word page: render & usage', () => {
         letters={getAlphabet()}
         abbreviations={abbreviations}
         crosslinks={crosslinks}
+        runes={runes}
       />,
     )
 
@@ -161,6 +167,7 @@ describe('Word page: data fetching', () => {
 
         crosslinks: [],
         letters: getAlphabet(),
+        runes: 'ᛋᛏᛅᚴᛁᛅ',
       },
     }