Skip to content

Commit 2b464c3

Browse files
committed
refactor: improve typescript configuration
1 parent 11713ad commit 2b464c3

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

56 files changed

+322
-175
lines changed

.gitignore

+1
Original file line numberDiff line numberDiff line change
@@ -34,3 +34,4 @@ apps/web/cypress/screenshots/**/__tkey-*.png
3434
apps/librelingo_tools/dist
3535
**/dist/
3636
*.tsbuildinfo
37+
report.*.*.json

.semaphore/semaphore.yml

+3-3
Original file line numberDiff line numberDiff line change
@@ -75,18 +75,18 @@ blocks:
7575
- checkout
7676
- cache restore node-$(checksum yarn.lock)
7777
- yarn eslint apps/*/cypress
78-
- name: Typescript Code Style Check
78+
- name: TypeScript check
7979
dependencies:
8080
- Eslint
8181
task:
8282
jobs:
83-
- name: typecodestyle
83+
- name: tsc
8484
commands:
8585
- sem-version node 12
8686
- checkout
8787
- cache restore node-$(checksum yarn.lock)
8888
- cache restore packages-web-$(checksum yarn.lock)
89-
- yarn stylecheck
89+
- yarn types
9090
- name: Sapper build
9191
dependencies:
9292
- Eslint Cypress

apps/answer-corrector/package.json

+2-2
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@
55
"main": "index.js",
66
"license": "AGPL-3.0-or-later",
77
"scripts": {
8-
"build": "tsc --build"
8+
"build": "tsc --build",
9+
"types": "tsc"
910
},
1011
"publishConfig": {
1112
"access": "public"
@@ -14,7 +15,6 @@
1415
"js-levenshtein": "1.1.6"
1516
},
1617
"devDependencies": {
17-
"@types/jest": "26.0.22",
1818
"@types/js-levenshtein": "1.1.0"
1919
}
2020
}

apps/answer-corrector/src/index.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@ const getSuggestion = ({
2222
suggester,
2323
form
2424
}: {
25-
alwaysSuggest: boolean,
25+
alwaysSuggest?: boolean,
2626
answer: string,
2727
mappedForm: string,
2828
suggester: (form: string) => string,

apps/answer-corrector/tsconfig.json

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
{
2+
"include": ["src/**/*"],
3+
"exclude": ["node_modules/*"],
4+
"compilerOptions": {
5+
"outDir": "dist",
6+
"esModuleInterop": true,
7+
"types": ["jest", "node"]
8+
},
9+
}

apps/lluis/package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,8 @@
55
"scripts": {
66
"eslintfix": "exit 0",
77
"prettierfix": "exit 0",
8-
"build": "exit 0"
8+
"build": "exit 0",
9+
"types": "exit 0"
910
},
1011
"dependencies": {
1112
"bulma": "0.9.1"

apps/lluis/tsconfig.json

+8
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"extends": "@tsconfig/svelte/tsconfig.json",
3+
"include": ["src/**/*", "src/node_modules"],
4+
"exclude": ["node_modules/*", "__sapper__/*", "public/*"],
5+
"compilerOptions": {
6+
"outDir": "dist"
7+
}
8+
}

apps/web/package.json

+5-3
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,7 @@
1010
"export": "sapper export",
1111
"start": "node __sapper__/build",
1212
"jest": "jest src",
13+
"types": "sapper build && tsc && svelte-check",
1314
"fetchPhotos": "./scripts/fetchPhotos.sh",
1415
"fetchAudios": "./scripts/fetchAudios.sh",
1516
"updateAllCourseData": "./scripts/updateAllCourseData.sh",
@@ -37,6 +38,7 @@
3738
"@fortawesome/fontawesome-svg-core": "1.2.35",
3839
"@fortawesome/free-brands-svg-icons": "5.15.3",
3940
"@fortawesome/free-solid-svg-icons": "5.15.3",
41+
"@librelingo/answer-corrector": "*",
4042
"@openfonts/noto-sans_all": "1.44.2",
4143
"bulma": "0.9.1",
4244
"bulma-pageloader": "0.3.0",
@@ -61,8 +63,7 @@
6163
"remark-rehype": "8.0.0",
6264
"sirv": "1.0.11",
6365
"sortablejs": "1.13.0",
64-
"svelte-i18n": "3.0.3",
65-
"@librelingo/answer-corrector": "*"
66+
"svelte-i18n": "3.0.3"
6667
},
6768
"devDependencies": {
6869
"@babel/core": "7.13.15",
@@ -71,6 +72,7 @@
7172
"@commitlint/config-conventional": "12.1.1",
7273
"@knapsack-pro/cypress": "4.3.0",
7374
"@percy/cypress": "2.3.4",
75+
"@types/node": "^14.14.37",
7476
"@types/sortablejs": "^1.10.6",
7577
"babel-jest": "26.6.3",
7678
"babel-plugin-istanbul": "6.0.0",
@@ -99,7 +101,7 @@
99101
"prettier": "2.2.1",
100102
"prettier-plugin-svelte": "2.2.0",
101103
"raw-loader": "4.0.2",
102-
"sapper": "0.29.1",
104+
"sapper": "^0.29.1",
103105
"sass-loader": "10.1.1",
104106
"style-loader": "2.0.0",
105107
"svelte": "3.37.0",

apps/web/src/Translate.svelte

+4-3
Original file line numberDiff line numberDiff line change
@@ -1,11 +1,12 @@
1-
<script>
1+
<script lang="typescript">
22
import { format } from "svelte-i18n"
3+
import isBrowser from "./utils/isBrowser"
34
4-
export let key
5+
export let key: string
56
</script>
67

78
<span data-tkey={key}>
8-
{#if process.browser === false && process.env.WEBPACK_MODE === "development"}
9+
{#if isBrowser() === false && process.env.WEBPACK_MODE === "development"}
910
<slot />
1011
{:else}
1112
{$format(key)}

apps/web/src/components/ChallengePanel.svelte

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="typescript">
22
import { slide } from "svelte/transition"
3-
import Button from "lluis/Button"
3+
import Button from "lluis/Button.svelte"
44
55
export let buttonText
66
export let buttonAction = null

apps/web/src/components/ChallengeScreen.svelte

+45-12
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
<script lang="typescript">
22
import sound from "../media/sound"
3-
import DeckChallenge from "./DeckChallenge"
4-
import OptionChallenge from "./OptionChallenge"
5-
import ShortInputChallenge from "./ShortInputChallenge"
6-
import ListeningChallenge from "./ListeningChallenge"
7-
import ChipsChallenge from "./ChipsChallenge"
8-
import FanfareScreen from "./FanfareScreen"
9-
import ProgressBar from "./ProgressBar"
3+
import DeckChallenge from "./DeckChallenge/index.svelte"
4+
import OptionChallenge from "./OptionChallenge/index.svelte"
5+
import ShortInputChallenge from "./ShortInputChallenge.svelte"
6+
import ListeningChallenge from "./ListeningChallenge.svelte"
7+
import ChipsChallenge from "./ChipsChallenge/index.svelte"
8+
import FanfareScreen from "./FanfareScreen.svelte"
9+
import ProgressBar from "./ProgressBar.svelte"
1010
import shuffle from "lodash.shuffle"
1111
import { fade, scale } from "svelte/transition"
1212
// TODO: deal with this ignore comment
@@ -22,7 +22,40 @@
2222
export let skillId
2323
export let expectedNumberOfChallenges
2424
25-
let challenges = sortChallengeGroups(
25+
type CardChallengeType = {
26+
id: string,
27+
type: "cards",
28+
pictures: Array<string>
29+
}
30+
31+
type ListeningChallengeType = {
32+
id: string,
33+
type: "listeningExercise",
34+
}
35+
36+
type OptionsChallengeType = {
37+
id: string,
38+
type: "options",
39+
}
40+
41+
type ShortInputChallengeType = {
42+
id: string,
43+
type: "shortInput",
44+
}
45+
46+
type ChipsChallengeType = {
47+
id: string,
48+
type: "chips",
49+
}
50+
51+
type ChallengeType =
52+
| CardChallengeType
53+
| ListeningChallengeType
54+
| OptionsChallengeType
55+
| ShortInputChallengeType
56+
| ChipsChallengeType
57+
58+
let challenges: Array<ChallengeType> = sortChallengeGroups(
2659
shuffle(rawChallenges),
2760
expectedNumberOfChallenges
2861
)
@@ -38,20 +71,20 @@
3871
skipped: 0,
3972
}
4073
41-
const preloadImage = (imageName) => {
74+
const preloadImage = (imageName: string) => {
4275
if (typeof Image === "undefined") return
4376
new Image().src = `images/${imageName}`
4477
}
4578
4679
challenges
47-
.filter(({ type }) => type === "card")
48-
.map(({ pictures }) => pictures.map(preloadImage))
80+
.filter(({ type }) => type === "cards")
81+
.map(({ pictures }: CardChallengeType) => pictures.map(preloadImage))
4982
5083
$: alternativeChallenges =
5184
currentChallenge &&
5285
rawChallenges.filter(({ id }) => id !== currentChallenge.id)
5386
54-
$: registerResult = (isCorrect) => {
87+
$: registerResult = (isCorrect: boolean) => {
5588
if (isCorrect) {
5689
stats.correct++
5790
skipAllChallenges = skipAllChallengesFunc
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,27 @@
1-
const getActualParent = node => node.parentElement.id ? node.parentElement : node.parentElement.parentElement
1+
const getActualParent = (node: HTMLElement): HTMLElement => {
2+
if (node?.parentElement?.id) {
3+
return node.parentElement
4+
}
5+
6+
if (node?.parentElement?.parentElement) {
7+
return node.parentElement.parentElement
8+
}
9+
10+
throw new Error("Invalid <Chip />")
11+
}
212

3-
export const getNodeType = node => getActualParent(node).id
13+
export const getNodeType = (node: HTMLElement): string => getActualParent(node).id
414

5-
export const getChipIndex = node => {
6-
if (!node.classList.contains("chip")) {
15+
export const getChipIndex = (node: HTMLElement): number => {
16+
if (!node.classList.contains("chip") && node.parentElement) {
717
return getChipIndex(node.parentElement)
818
}
919

10-
if (!node.previousSibling) {
11-
return 0
20+
21+
if (node.previousSibling !== null) {
22+
return 1 + getChipIndex(node.previousSibling as HTMLElement)
1223
}
1324

14-
return 1 + getChipIndex(node.previousSibling)
25+
return 0
26+
1527
}

apps/web/src/components/ChipsChallenge/index.svelte

+2-2
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@
33
import hotkeys from "hotkeys-js"
44
import shuffle from "lodash.shuffle"
55
import { writable } from "svelte/store"
6-
import ChallengePanel from "../ChallengePanel"
7-
import Phrase from "../Phrase"
6+
import ChallengePanel from "../ChallengePanel.svelte"
7+
import Phrase from "../Phrase.svelte"
88
import { createSortable } from "./sortable"
99
import { getNodeType, getChipIndex } from "./chips"
1010

apps/web/src/components/ChipsChallenge/sortable.ts

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
1+
import type { Writable } from "svelte/store"
12
import Sortable from "sortablejs"
23

3-
export const createSortable = (element, store) => {
4+
export const createSortable = (element: HTMLElement, store: Writable<string[]>): Sortable => {
45
return Sortable.create(element, {
56
group: "chips",
67
store: {
7-
get: store.get,
8+
get: () => [],
89
set: function(sortable) {
910
store.set(sortable.toArray())
1011
}

apps/web/src/components/DeckChallenge/index.svelte

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
<script lang="typescript">
22
import { onMount } from "svelte"
33
import hotkeys from "hotkeys-js"
4-
import OptionDeck from "../OptionDeck"
5-
import ChallengePanel from "../ChallengePanel"
4+
import OptionDeck from "../OptionDeck.svelte"
5+
import ChallengePanel from "../ChallengePanel.svelte"
66
import { prepareChallenge } from "../../logic"
77
88
export let currentChallenge

apps/web/src/components/FanfareScreen.svelte

+6-6
Original file line numberDiff line numberDiff line change
@@ -6,12 +6,12 @@
66
import hotkeys from "hotkeys-js"
77
import { onMount } from "svelte"
88
import { goto } from "@sapper/app"
9-
import Mascot from "./Mascot"
10-
import TwitterButton from "./TwitterButton"
11-
import Button from "lluis/Button"
12-
import Column from "lluis/Column"
13-
import Columns from "lluis/Columns"
14-
import Title from "lluis/Title"
9+
import Mascot from "./Mascot.svelte"
10+
import TwitterButton from "./TwitterButton.svelte"
11+
import Button from "lluis/Button.svelte"
12+
import Column from "lluis/Column.svelte"
13+
import Columns from "lluis/Columns.svelte"
14+
import Title from "lluis/Title.svelte"
1515
1616
export let rawChallenges
1717
export let courseURL

apps/web/src/components/GitHubButton.svelte

+14-6
Original file line numberDiff line numberDiff line change
@@ -11,15 +11,23 @@
1111

1212
<script lang="typescript">
1313
import { onMount } from "svelte"
14-
import Icon from "lluis/Icon"
15-
import Button from "lluis/Button"
14+
import isBrowser from "../utils/isBrowser"
15+
import Icon from "lluis/Icon.svelte"
16+
import Button from "lluis/Button.svelte"
17+
import isCypress from "../utils/isCypress"
1618
// eslint-disable-next-line @typescript-eslint/no-var-requires
1719
const pMemoize = require("p-memoize")
18-
export let stars = (process.browser === true ? window.stars : null) || " "
20+
21+
type WindowWithStars = Window & {
22+
stars: number,
23+
star_count: number,
24+
}
25+
26+
export let stars = (isBrowser() === true ? (window as unknown as WindowWithStars).stars : null) || " "
1927
export let size = "small"
2028
2129
onMount(async () => {
22-
if (process.browser === true && window.isCypress) {
30+
if (isBrowser() === true && isCypress()) {
2331
stars = 999
2432
return
2533
}
@@ -30,8 +38,8 @@
3038
.then((res) => res.json())
3139
.then(({ stargazers_count }) => {
3240
stars = stargazers_count
33-
if (process.browser === true) {
34-
window.star_count = stargazers_count
41+
if (isBrowser() === true) {
42+
(window as unknown as WindowWithStars).star_count = stargazers_count
3543
}
3644
})
3745
})

0 commit comments

Comments
 (0)