(ts) migrate

components/Example.vue

@@ -14,14 +14,17 @@
     </span>
 </template>
 
-<script>
-export default {
+<script lang="ts">
+import Vue from 'vue';
+import { Example, Pronoun } from '../src/classes.ts';
+
+export default Vue.extend({
     props: {
-        example: { required: true },
-        pronoun: { required: true },
-        counter: { default: 0 },
+        example: { required: true, type: Example },
+        pronoun: { required: true, type: Pronoun },
+        counter: { default: 0, type: Number },
         link: { type: Boolean },
         pronunciation: { type: Boolean },
     },
-};
+});
 </script>

components/Morpheme.vue

@@ -1,42 +1,43 @@
 <template>
     <span
-        :class="['morpheme', 'rounded', highlightedMorpheme == baseMorpheme ? 'bg-primary text-white' : '']"
+        :class="['morpheme', 'rounded', highlightedMorpheme === baseMorpheme ? 'bg-primary text-white' : '']"
         @mouseenter="highlightMorpheme(baseMorpheme)"
         @mouseleave="highlightMorpheme(null)"
-        @touchstart="highlightMorpheme(highlightedMorpheme == baseMorpheme ? null : baseMorpheme)"
+        @touchstart="highlightMorpheme(highlightedMorpheme === baseMorpheme ? null : baseMorpheme)"
     ><Spelling escape :text="prepend + pronoun.getMorpheme(morpheme, counter) + append" /></span>
 </template>
 
-<script>
-import { mapState } from 'vuex';
+<script lang="ts">
+import Vue from 'vue';
+import { Pronoun } from '../src/classes.ts';
 
-export default {
+export default Vue.extend({
     props: {
-        pronoun: { required: true },
-        morpheme: { required: true },
-        counter: { default: 0 },
+        pronoun: { required: true, type: Pronoun },
+        morpheme: { required: true, type: String },
+        counter: { default: 0, type: Number },
 
-        prepend: { default: '' },
-        append: { default: '' },
+        prepend: { default: '', type: String },
+        append: { default: '', type: String },
     },
     computed: {
-        baseMorpheme: {
-            get() {
-                if (this.morpheme[0] == '\'') {
-                    return this.morpheme.substring(1);
-                } else {
-                    return this.morpheme;
-                }
-            },
+        highlightedMorpheme() {
+            return this.$store.state.highlightedMorpheme;
+        },
+        baseMorpheme() {
+            if (this.morpheme.startsWith('\'')) {
+                return this.morpheme.substring(1);
+            } else {
+                return this.morpheme;
+            }
         },
-        ...mapState(['highlightedMorpheme']),
     },
     methods: {
-        highlightMorpheme(morpheme) {
+        highlightMorpheme(morpheme: string | null): void {
             this.$store.commit('highlightMorpheme', morpheme);
         },
     },
-};
+});
 </script>
 
 <style>

components/MorphemeWithPronunciation.vue

@@ -1,25 +1,33 @@
 <template>
     <span v-if="pronoun.getMorpheme(morpheme, counter)">
         <Morpheme :pronoun="pronoun" :morpheme="morpheme" :counter="counter" :prepend="prepend" :append="append" />
-        <Pronunciation
-            v-if="pronoun.pronounceable && pronoun.getPronunciation(morpheme, counter) && !pronoun.getPronunciation(morpheme, counter).startsWith('=')"
-            :pronunciation="`/${prependPr}${pronoun.getPronunciation(morpheme, counter)}${appendPr}/`"
-            text
-        />
+        <Pronunciation v-if="pronunciation" :pronunciation="pronunciation" text />
     </span>
 </template>
 
-<script>
-export default {
-    props: {
-        pronoun: { required: true },
-        morpheme: { required: true },
-        counter: { default: 0 },
+<script lang="ts">
+import Vue from 'vue';
+import { Pronoun } from '../src/classes.ts';
 
-        prepend: { default: '' },
-        prependPr: { default: '' },
-        append: { default: '' },
-        appendPr: { default: '' },
+export default Vue.extend({
+    props: {
+        pronoun: { required: true, type: Pronoun },
+        morpheme: { required: true, type: String },
+        counter: { default: 0, type: Number },
+
+        prepend: { default: '', type: String },
+        prependPr: { default: '', type: String },
+        append: { default: '', type: String },
+        appendPr: { default: '', type: String },
     },
-};
+    computed: {
+        pronunciation(): string | null {
+            const pronunciation = this.pronoun.getPronunciation(this.morpheme, this.counter);
+            if (!this.pronoun.pronounceable || !pronunciation || pronunciation.startsWith('=')) {
+                return null;
+            }
+            return `/${this.prependPr}${this.pronoun.getPronunciation(this.morpheme, this.counter)}${this.appendPr}/`;
+        },
+    },
+});
 </script>

routes/adminProfiles.vue

@@ -20,10 +20,11 @@
     </Page>
 </template>
 
-<script>
+<script lang="ts">
+import Vue from 'vue';
 import { head } from '../src/helpers.ts';
 
-export default {
+export default Vue.extend({
     async asyncData({ app }) {
         return {
             chart: await app.$axios.$get(`/admin/stats/users-chart/${process.env.LOCALE}`),
@@ -34,5 +35,5 @@ export default {
             title: `${this.$t('admin.header')} • Profiles`,
         });
     },
-};
+});
 </script>

server/routes/census.js

@@ -4,7 +4,7 @@ import sha1 from 'sha1';
 import { ulid } from 'ulid';
 import Papa from 'papaparse';
 import { groupBy, handleErrorAsync } from '../../src/helpers.ts';
-import { intersection, difference } from '../../src/sets.js';
+import { intersection, difference } from '../../src/sets.ts';
 import { buildChart } from '../../src/stats.ts';
 import auditLog from '../audit.ts';
 

src/sets.ts

@@ -1,6 +1,6 @@
 // https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set
 
-export const isSuperset = (set, subset) => {
+export const isSuperset = <T>(set: Set<T>, subset: Set<T>): boolean => {
     for (const elem of subset) {
         if (!set.has(elem)) {
             return false;
@@ -9,7 +9,7 @@ export const isSuperset = (set, subset) => {
     return true;
 };
 
-export const union = (setA, setB) => {
+export const union = <T>(setA: Set<T>, setB: Set<T>): Set<T> => {
     const _union = new Set(setA);
     for (const elem of setB) {
         _union.add(elem);
@@ -17,8 +17,8 @@ export const union = (setA, setB) => {
     return _union;
 };
 
-export const intersection = (setA, setB) => {
-    const _intersection = new Set();
+export const intersection = <T>(setA: Set<T>, setB: Set<T>): Set<T> => {
+    const _intersection: Set<T> = new Set();
     for (const elem of setB) {
         if (setA.has(elem)) {
             _intersection.add(elem);
@@ -27,7 +27,7 @@ export const intersection = (setA, setB) => {
     return _intersection;
 };
 
-export const symmetricDifference = (setA, setB) => {
+export const symmetricDifference = <T>(setA: Set<T>, setB: Set<T>): Set<T> => {
     const _difference = new Set(setA);
     for (const elem of setB) {
         if (_difference.has(elem)) {
@@ -39,7 +39,7 @@ export const symmetricDifference = (setA, setB) => {
     return _difference;
 };
 
-export const difference = (setA, setB) => {
+export const difference = <T>(setA: Set<T>, setB: Set<T>): Set<T> => {
     const _difference = new Set(setA);
     for (const elem of setB) {
         _difference.delete(elem);