#123 [sources] sources: linking different language versions

components/Source.vue

@@ -1,7 +1,9 @@
 <template>
     <div class="my-2" v-if="!deleted">
-        <Icon :v="source.icon()"/>
+        <h3 class="h6">
-        <strong><template v-if="source.author">{{source.author.replace('^', '')}}</template><span v-if="source.author"> – </span><em><a v-if="source.link" :href="source.link" target="_blank" rel="noopener">{{source.title}}</a><span v-else>{{source.title}}</span></em></strong><template v-if="source.extra"> ({{source.extra}})</template>, {{source.year}}<template v-if="source.comment">; {{source.comment}}</template>
+            <Icon :v="source.icon()"/>
+            <strong><template v-if="source.author">{{source.author.replace('^', '')}}</template><span v-if="source.author"> – </span><em><a v-if="source.link" :href="source.link" target="_blank" rel="noopener">{{source.title}}</a><span v-else>{{source.title}}</span></em></strong><template v-if="source.extra"> ({{source.extra}})</template>, {{source.year}}<template v-if="source.comment">; {{source.comment}}</template>
+        </h3>
         <ul class="list-inline" v-if="manage && $isGranted('sources')">
             <li v-if="!source.approved" class="list-inline-item">
                 <span class="badge badge-danger">
@@ -62,6 +64,19 @@
                 <T>quotation.start</T><span v-html="fragment.replace(/\n/g, '<br/>')"></span><T>quotation.end</T>
             </li>
         </ul>
+        <div v-if="source.versions.length" class="my-3">
+            <h4 class="h6"><T>sources.otherVersions</T>:</h4>
+            <ul>
+                <li v-for="version in source.versions">
+                    <h4 class="h6">
+                        <strong>
+                            <a :href="`${locales[version.locale].url}/${version.pronouns[0]}`" target="_blank" rel="noopener">{{locales[version.locale].name}}</a>:
+                        </strong>
+                    </h4>
+                    <Source :source="version"/>
+                </li>
+            </ul>
+        </div>
     </div>
 </template>
 
@@ -69,6 +84,7 @@
     import {pronounLibrary} from "../src/data";
 
     export default {
+        name: 'Source',
         props: {
             source: { required: true },
             manage: { type: Boolean },

locale/en/translations.suml

@@ -96,6 +96,7 @@ sources:
         moderation: 'Submissions will have to get approved before getting published.'
         key: 'Key'
         keyInfo: 'Identifier for linking sources between language versions and linking with the dictionary'
+    otherVersions: 'In other languages'
 
 
 nouns:

locale/es/translations.suml

@@ -96,6 +96,7 @@ sources:
         moderation: 'Los envíos deben ser aprobados antes de ser publicados.'
         key: 'Key'  # TODO
         keyInfo: 'Identifier for linking sources between language versions and linking with the dictionary'  # TODO
+    otherVersions: 'In other languages' # TODO
 
 nouns:
     header: 'Diccionario'

locale/pl/translations.suml

@@ -195,6 +195,7 @@ sources:
         moderation: 'Propozycje będą musiały zostać zatwierdzone przed opublikowaniem.'
         key: 'Klucz'
         keyInfo: 'Identyfikator do łączenia tekstów między wersjami językowymi i łączenia ze słownikiem'
+    otherVersions: 'W innych językach'
 
 nouns:
     header: 'Słowniki'

locale/zh/translations.suml

@@ -94,6 +94,7 @@ sources:
         moderation: '提交的內容必須先獲得批准才能發布。'
         key: 'Key'  # TODO
         keyInfo: 'Identifier for linking sources between language versions and linking with the dictionary'  # TODO
+    otherVersions: 'In other languages' # TODO
 
 nouns:
     header: '字典'

server/routes/sources.js

@@ -18,27 +18,53 @@ const approve = async (db, id) => {
     `);
 }
 
+const linkOtherVersions = async (req, sources) => {
+    const keys = new Set(sources.filter(s => !!s && s.key).map(s => `'` + s.key + `'`));
+
+    const otherVersions = await req.db.all(SQL`
+        SELECT s.*, u.username AS submitter FROM sources s
+        LEFT JOIN users u ON s.submitter_id = u.id
+        WHERE s.locale != ${req.config.locale}
+        AND s.deleted = 0
+        AND s.approved >= ${req.isGranted('sources') ? 0 : 1}
+        AND s.key IN (`.append([...keys].join(',')).append(SQL`)
+    `));
+
+    const otherVersionsMap = {};
+    otherVersions.forEach(version => {
+        if (otherVersionsMap[version.key] === undefined) {
+            otherVersionsMap[version.key] = [];
+        }
+        otherVersionsMap[version.key].push(version);
+    });
+
+    return sources.map(s => {
+        s.versions = s.key ? otherVersionsMap[s.key] || [] : [];
+        return s;
+    });
+};
+
 const router = Router();
 
 router.get('/sources', async (req, res) => {
-    return res.json(await req.db.all(SQL`
+    return res.json(await linkOtherVersions(req, await req.db.all(SQL`
         SELECT s.*, u.username AS submitter FROM sources s
         LEFT JOIN users u ON s.submitter_id = u.id
         WHERE s.locale = ${req.config.locale}
         AND s.deleted = 0
         AND s.approved >= ${req.isGranted('sources') ? 0 : 1}
-    `));
+    `)));
 });
 
 router.get('/sources/:id', async (req, res) => {
-    return res.json(await req.db.all(SQL`
+    return res.json(await linkOtherVersions(req, await req.db.all(SQL`
         SELECT s.*, u.username AS submitter FROM sources s
         LEFT JOIN users u ON s.submitter_id = u.id
         WHERE s.locale = ${req.config.locale}
         AND s.deleted = 0
         AND s.approved >= ${req.isGranted('sources') ? 0 : 1}
         AND s.id = ${req.params.id}
-    `));
+    `)));
 });
 
 router.post('/sources/submit', async (req, res) => {

src/classes.js

@@ -99,7 +99,12 @@ function clone(mainObject) {
 }
 
 export class Source {
-    constructor ({id, pronouns, type, author, title, extra, year, fragments = '', comment = null, link = null, key = null, submitter = null, approved, base_id = null,}) {
+    constructor ({
+             id, pronouns, type, author, title, extra, year, fragments = '',
+             comment = null, link = null,
+             submitter = null, approved, base_id = null,
+             key = null, versions = [], locale = config.locale,
+    }) {
         this.id = id;
         this.pronouns = pronouns ? pronouns.split(';') : [];
         this.type = type;
@@ -110,10 +115,12 @@ export class Source {
         this.fragments = fragments ? fragments.replace(/\|/g, '\n').split('@') : [];
         this.comment = comment;
         this.link = link;
-        this.key = key;
         this.submitter = submitter;
         this.approved = approved;
         this.base_id = base_id;
+        this.key = key;
+        this.versions = versions.map(v => new Source(v));
+        this.locale = locale;
     }
 
     static get TYPES() {