feat: enable stricter type checking options

feat: make the app more fault tolerant
This commit is contained in:
2024-04-06 14:28:23 +02:00
parent bef51d2a7d
commit 2808973ad0
38 changed files with 152 additions and 121 deletions

View File

@@ -95,6 +95,7 @@ export function restoreFromFile(
switch (file.type) {
case "backup": {
const recent = file.history[0];
if (!recent) return;
if (recent[1].device !== get(serialPort)?.device) {
alert("Backup is incompatible with this device");
throw new Error("Backup is incompatible with this device");
@@ -177,7 +178,7 @@ export function getChangesFromLayoutFile(file: CharaLayoutFile) {
const changes: Change[] = [];
for (const [layer, keys] of file.layout.entries()) {
for (const [id, action] of keys.entries()) {
if (get(layout)[layer][id].action !== action) {
if (get(layout)[layer]?.[id]?.action !== action) {
changes.push({
type: ChangeType.Layout,
layer,

View File

@@ -13,11 +13,11 @@ export function csvChordsToJson(csv: string): CharaChordFile {
.map((line) => {
const [input, output] = line.split(/,(?=[^,]*$)/, 2);
return [
input
input!
.split("+")
.map((it) => KEYMAP_IDS.get(it.trim())?.code ?? 0)
.sort((a, b) => a - b),
output
output!
.trim()
.split("")
.map((it) => KEYMAP_IDS.get(SPECIAL_KEYS.get(it) ?? it)?.code ?? 0),

View File

@@ -17,7 +17,7 @@ export function csvLayoutToJson(
for (const layer of csv.trim().split("\n")) {
const [layerId, key, action] = layer.substring(1).split(",").map(Number);
layout.layout[Number(layerId) - 1][Number(key)] = Number(action);
layout.layout[Number(layerId) - 1]![Number(key)] = Number(action);
}
return layout;

View File

@@ -10,7 +10,7 @@
$: info =
typeof action === "number"
? KEYMAP_CODES[action] ?? { code: action }
? KEYMAP_CODES.get(action) ?? { code: action }
: action;
$: dynamicMapping = info.keyCode && $osLayout.get(info.keyCode);

View File

@@ -6,7 +6,7 @@
export let id: number | KeyInfo;
$: key = (typeof id === "number" ? KEYMAP_CODES[id] ?? id : id) as
$: key = (typeof id === "number" ? KEYMAP_CODES.get(id) ?? id : id) as
| number
| KeyInfo;
</script>
@@ -25,10 +25,10 @@
{#if key.description}
<i>{key.description}</i>
{/if}
{#if key.category.name === "ASCII Macros"}
{#if key.category?.name === "ASCII Macros"}
<span class="warning">{@html $LL.actionSearch.SHIFT_WARNING()}</span>
{/if}
{#if key.category.name === "CP-1252"}
{#if key.category?.name === "CP-1252"}
<span class="warning">{@html $LL.actionSearch.ALT_CODE_WARNING()}</span>
{/if}
</div>

View File

@@ -1,4 +1,5 @@
<script>
// @ts-expect-error no types here
import { useRegisterSW } from "virtual:pwa-register/svelte";
const { needRefresh, updateServiceWorker, offlineReady } = useRegisterSW();

View File

@@ -4,7 +4,7 @@
function submit(event: Event) {
event.preventDefault();
$serialPort.send(value.trim());
$serialPort?.send(0, value.trim());
value = "";
io.scrollTo({ top: io.scrollHeight });
}

View File

@@ -26,7 +26,7 @@
);
function search() {
results = index!.search(searchBox.value);
results = index!.search(searchBox.value) as number[];
exact = exactIndex[searchBox.value]?.code;
code = Number(searchBox.value);
}

View File

@@ -121,9 +121,11 @@
function edit(index: number) {
const keyInfo = layoutInfo.keys[index];
if (!keyInfo) return;
const clickedGroup = groupParent.children.item(index) as SVGGElement;
const nextAction = get(layout)[get(activeLayer)][keyInfo.id];
const currentAction = get(deviceLayout)[get(activeLayer)][keyInfo.id];
const nextAction = get(layout)[get(activeLayer)]?.[keyInfo.id];
const currentAction = get(deviceLayout)[get(activeLayer)]?.[keyInfo.id];
if (!nextAction || !currentAction) return;
const component = new ActionSelector({
target: document.body,
props: {

View File

@@ -23,13 +23,12 @@
</script>
{#each positions as position, layer}
{@const { action: actionId, isApplied } = $layout[layer][key.id] ?? {
{@const { action: actionId, isApplied } = $layout[layer]?.[key.id] ?? {
action: 0,
isApplied: true,
}}
{@const { code, icon, id, display, title, keyCode, variant } = KEYMAP_CODES[
actionId
] ?? { code: actionId }}
{@const { code, icon, id, display, title, keyCode, variant } =
KEYMAP_CODES.get(actionId) ?? { code: actionId }}
{@const dynamicMapping = keyCode && $osLayout.get(keyCode)}
{@const tooltip =
(title ?? id ?? `0x${code.toString(16)}`) +
@@ -53,7 +52,7 @@
style:scale={isActive ? 1 : `var(--inactive-scale, ${inactiveScale})`}
style:translate={isActive
? "0 0 0"
: `${direction[0].toPrecision(2)}px ${direction[1].toPrecision(2)}px 0`}
: `${direction[0]?.toPrecision(2)}px ${direction[1]?.toPrecision(2)}px 0`}
style:rotate="{rotate}deg"
use:action={{ title: tooltip }}
>

View File

@@ -119,17 +119,21 @@
</label>
</h3>
<ul>
{#each layoutChanges
.map((it, i) => /** @type {const} */ ([it, i + 1]))
.filter(([it]) => it.length > 0) as [changes, layer]}
<li>
<h4>
<label>
<input type="checkbox" class="checkbox" />
{$LL.changes.layout.LAYER({ changes: changes.length, layer })}
</label>
</h4>
</li>
{#each layoutChanges as changes, i}
{@const layer = i + 1}
{#if changes.length > 0}
<li>
<h4>
<label>
<input type="checkbox" class="checkbox" />
{$LL.changes.layout.LAYER({
changes: changes.length,
layer,
})}
</label>
</h4>
</li>
{/if}
{/each}
</ul>
</li>

View File

@@ -3,7 +3,7 @@
export let ports: SerialPort[];
const dispatch = createEventDispatcher<{ confirm: SerialPort | undefined }>();
let selected = ports[0].getInfo().name;
let selected = ports[0]?.getInfo().name;
</script>
<dialog>

View File

@@ -37,7 +37,7 @@ export function serializeActions(actions: number[]): bigint {
let native = 0n;
for (let i = 1; i <= actions.length; i++) {
native |=
BigInt(actions[actions.length - i] & 0x3ff) << BigInt((12 - i) * 10);
BigInt(actions[actions.length - i]! & 0x3ff) << BigInt((12 - i) * 10);
}
return native;
}

View File

@@ -67,7 +67,9 @@ export async function sync() {
syncStatus.set("downloading");
const max =
Object.keys(settingInfo.settings).length + device.keyCount * 3 + chordCount;
Object.keys(settingInfo["settings"]).length +
device.keyCount * 3 +
chordCount;
let current = 0;
syncProgress.set({ max, current });
function progressTick() {
@@ -76,7 +78,7 @@ export async function sync() {
}
const parsedSettings: number[] = [];
for (const key in settingInfo.settings) {
for (const key in settingInfo["settings"]) {
try {
parsedSettings[Number.parseInt(key)] = await device.getSetting(
Number.parseInt(key),
@@ -89,7 +91,7 @@ export async function sync() {
const parsedLayout: CharaLayout = [[], [], []];
for (let layer = 1; layer <= 3; layer++) {
for (let i = 0; i < device.keyCount; i++) {
parsedLayout[layer - 1][i] = await device.getLayoutKey(layer, i);
parsedLayout[layer - 1]![i] = await device.getLayoutKey(layer, i);
progressTick();
}
}

View File

@@ -48,11 +48,17 @@ export async function getViablePorts(): Promise<SerialPort[]> {
);
}
type LengthArray<T, N extends number, R extends T[] = []> = number extends N
? T[]
: R["length"] extends N
? R
: LengthArray<T, N, [T, ...R]>;
export async function canAutoConnect() {
return getViablePorts().then((it) => it.length === 1);
}
function timeout<T>(promise: Promise<T>, ms: number): Promise<T> {
async function timeout<T>(promise: Promise<T>, ms: number): Promise<T> {
let timer: number;
return Promise.race([
promise,
@@ -96,7 +102,7 @@ export class CharaDevice {
const ports = await getViablePorts();
this.port =
!manual && ports.length === 1
? ports[0]
? ports[0]!
: await navigator.serial.requestPort({
filters: [...PORT_FILTERS.values()],
});
@@ -115,9 +121,9 @@ export class CharaDevice {
await this.port.close();
this.version = new SemVer(
await this.send("VERSION").then(([version]) => version),
await this.send(1, "VERSION").then(([version]) => version),
);
const [company, device, chipset] = await this.send("ID");
const [company, device, chipset] = await this.send(3, "ID");
this.company = company as "CHARACHORDER";
this.device = device as "ONE" | "LITE" | "X";
this.chipset = chipset as "M0" | "S2";
@@ -186,6 +192,7 @@ export class CharaDevice {
return it;
});
}
return undefined;
}
/**
@@ -256,20 +263,38 @@ export class CharaDevice {
/**
* Send to serial port
*/
async send(...command: string[]) {
async send<T extends number>(
expectedLength: T,
...command: string[]
): Promise<LengthArray<string, T>> {
return this.runWith(async (send, read) => {
await send(...command);
const commandString = command
.join(" ")
.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, "\\$&");
return read().then((it) =>
it.replace(new RegExp(`^${commandString} `), "").split(" "),
);
const readResult = await read();
if (readResult === undefined) {
console.error("No response");
return Array(expectedLength).fill("NO_RESPONSE") as LengthArray<
string,
T
>;
}
const array = readResult
.replace(new RegExp(`^${commandString} `), "")
.split(" ");
if (array.length < expectedLength) {
console.error("Response too short");
return array.concat(
Array(expectedLength - array.length).fill("TOO_SHORT"),
) as LengthArray<string, T>;
}
return array as LengthArray<string, T>;
});
}
async getChordCount(): Promise<number> {
const [count] = await this.send("CML C0");
const [count] = await this.send(1, "CML C0");
return Number.parseInt(count);
}
@@ -277,7 +302,7 @@ export class CharaDevice {
* Retrieves a chord by index
*/
async getChord(index: number | number[]): Promise<Chord> {
const [actions, phrase] = await this.send(`CML C1 ${index}`);
const [actions, phrase] = await this.send(2, `CML C1 ${index}`);
return {
actions: parseChordActions(actions),
phrase: parsePhrase(phrase),
@@ -289,6 +314,7 @@ export class CharaDevice {
*/
async getChordPhrase(actions: number[]): Promise<number[] | undefined> {
const [phrase] = await this.send(
1,
`CML C2 ${stringifyChordActions(actions)}`,
);
return phrase === "2" ? undefined : parsePhrase(phrase);
@@ -296,6 +322,7 @@ export class CharaDevice {
async setChord(chord: Chord) {
const [status] = await this.send(
1,
"CML",
"C3",
stringifyChordActions(chord.actions),
@@ -306,10 +333,10 @@ export class CharaDevice {
async deleteChord(chord: Pick<Chord, "actions">) {
const status = await this.send(
1,
`CML C4 ${stringifyChordActions(chord.actions)}`,
);
console.log(status);
if (status.at(-1) !== "2" && status.at(-1) !== "0")
if (status?.at(-1) !== "2" && status?.at(-1) !== "0")
throw new Error(`Failed with status ${status}`);
}
@@ -320,8 +347,7 @@ export class CharaDevice {
* @param action the assigned action id
*/
async setLayoutKey(layer: number, id: number, action: number) {
const [status] = await this.send(`VAR B4 A${layer} ${id} ${action}`);
console.log(status);
const [status] = await this.send(1, `VAR B4 A${layer} ${id} ${action}`);
if (status !== "0") throw new Error(`Failed with status ${status}`);
}
@@ -332,7 +358,7 @@ export class CharaDevice {
* @returns the assigned action id
*/
async getLayoutKey(layer: number, id: number) {
const [position, status] = await this.send(`VAR B3 A${layer} ${id}`);
const [position, status] = await this.send(2, `VAR B3 A${layer} ${id}`);
if (status !== "0") throw new Error(`Failed with status ${status}`);
return Number(position);
}
@@ -345,7 +371,7 @@ export class CharaDevice {
* **This does not need to be called for chords**
*/
async commit() {
const [status] = await this.send("VAR B0");
const [status] = await this.send(1, "VAR B0");
if (status !== "0") throw new Error(`Failed with status ${status}`);
}
@@ -357,6 +383,7 @@ export class CharaDevice {
*/
async setSetting(id: number, value: number) {
const [status] = await this.send(
1,
`VAR B2 ${id.toString(16).toUpperCase()} ${value}`,
);
if (status !== "0") throw new Error(`Failed with status ${status}`);
@@ -367,6 +394,7 @@ export class CharaDevice {
*/
async getSetting(id: number): Promise<number> {
const [value, status] = await this.send(
2,
`VAR B1 ${id.toString(16).toUpperCase()}`,
);
if (status !== "0")
@@ -380,14 +408,14 @@ export class CharaDevice {
* Reboots the device
*/
async reboot() {
await this.send("RST");
await this.send(0, "RST");
}
/**
* Reboots the device to the bootloader
*/
async bootloader() {
await this.send("RST BOOTLOADER");
await this.send(0, "RST BOOTLOADER");
}
/**
@@ -396,7 +424,7 @@ export class CharaDevice {
async reset(
type: "FACTORY" | "PARAMS" | "KEYMAPS" | "STARTER" | "CLEARCML" | "FUNC",
) {
await this.send(`RST ${type}`);
await this.send(0, `RST ${type}`);
}
/**
@@ -405,6 +433,6 @@ export class CharaDevice {
* This is useful for debugging when there is a suspected heap or stack issue.
*/
async getRamBytesAvailable(): Promise<number> {
return Number(await this.send("RAM"));
return Number(await this.send(1, "RAM").then(([bytes]) => bytes));
}
}

View File

@@ -2,7 +2,7 @@ import type { ActionInfo, KeymapCategory } from "$lib/assets/keymaps/keymap";
export interface KeyInfo extends Partial<ActionInfo> {
code: number;
category: KeymapCategory;
category?: KeymapCategory;
}
export const KEYMAP_CATEGORIES = (await Promise.all(
@@ -11,7 +11,7 @@ export const KEYMAP_CATEGORIES = (await Promise.all(
),
)) as KeymapCategory[];
export const KEYMAP_CODES: Record<number, KeyInfo> = Object.fromEntries(
export const KEYMAP_CODES = new Map<number, KeyInfo>(
KEYMAP_CATEGORIES.flatMap((category) =>
Object.entries(category.actions).map(([code, action]) => [
Number(code),
@@ -20,7 +20,7 @@ export const KEYMAP_CODES: Record<number, KeyInfo> = Object.fromEntries(
),
);
export const KEYMAP_KEYCODES: Map<string, number> = new Map(
export const KEYMAP_KEYCODES = new Map<string, number>(
KEYMAP_CATEGORIES.flatMap((category) =>
Object.entries(category.actions).map(
([code, action]) => [action.keyCode!, Number(code)] as const,
@@ -28,7 +28,7 @@ export const KEYMAP_KEYCODES: Map<string, number> = new Map(
).filter(([keyCode]) => keyCode !== undefined),
);
export const KEYMAP_IDS: Map<string, KeyInfo> = new Map(
export const KEYMAP_IDS = new Map<string, KeyInfo>(
KEYMAP_CATEGORIES.flatMap((category) =>
Object.entries(category.actions).map(
([code, action]) =>

View File

@@ -14,9 +14,9 @@ export class SemVer {
console.error("Invalid version string:", versionString);
} else {
const [, major, minor, patch, preRelease, meta] = result;
this.major = Number.parseInt(major);
this.minor = Number.parseInt(minor);
this.patch = Number.parseInt(patch);
this.major = Number.parseInt(major ?? "NaN");
this.minor = Number.parseInt(minor ?? "NaN");
this.patch = Number.parseInt(patch ?? "NaN");
if (preRelease) this.preRelease = preRelease;
if (meta) this.meta = meta;
}

View File

@@ -40,7 +40,6 @@ function NativeSerialPort(info: SerialPortInfo): TauriSerialPort {
}
// @ts-expect-error polyfill
// noinspection JSConstantReassignment
navigator.serial = {
async getPorts(): Promise<SerialPort[]> {
return invoke<any[]>("plugin:serial|get_serial_ports").then((ports) =>
@@ -69,6 +68,7 @@ navigator.serial = {
props: { ports },
});
const port = await new Promise<SerialPort>((resolve) =>
// @ts-expect-error polyfill
dialog.$on("confirm", resolve),
);
dialog.$destroy();

View File

@@ -1,12 +0,0 @@
export async function updateDevice(port: SerialPort) {
await port.open({
baudRate: 115200,
dataBits: 8,
stopBits: 1,
parity: "none",
bufferSize: 255,;
})
const writer = port.writable!.getWriter()
const reader = port.readable!.getReader()
}

View File

@@ -23,9 +23,9 @@ export function compressActions(actions: number[]): Uint8Array {
export function decompressActions(raw: Uint8Array): number[] {
const actions: number[] = [];
for (let i = 0; i < raw.length; i++) {
let action = raw[i];
if (action > 0 && action < 32) {
action = (action << 8) | raw[++i];
let action = raw[i]!;
if (action > 0 && action < 32 && i + 1 < raw.length) {
action = (action << 8) | raw[++i]!;
}
actions.push(action);
}

View File

@@ -16,7 +16,7 @@ export const setting: Action<
const unsubscribe = settings.subscribe(async (settings) => {
if (id in settings) {
const { value, isApplied } = settings[id];
const { value, isApplied } = settings[id]!;
if (type === "number") {
node.value = (
inverse !== undefined

View File

@@ -10,7 +10,7 @@ export function triggerShare(event: Event) {
}
export const share: Action<Window, (event: Event) => void> = (
node,
_node,
callback: (event: Event) => void,
) => {
setCanShare.set(true);

View File

@@ -60,7 +60,7 @@ export const overlay = derived(changes, (changes) => {
for (const change of changes) {
switch (change.type) {
case ChangeType.Layout:
overlay.layout[change.layer].set(change.id, change.action);
overlay.layout[change.layer]?.set(change.id, change.action);
break;
case ChangeType.Chord:
overlay.chords.set(JSON.stringify(change.id), {
@@ -92,8 +92,8 @@ export const layout = derived([overlay, deviceLayout], ([overlay, layout]) =>
layout.map(
(actions, layer) =>
actions.map<KeyInfo>((action, id) => ({
action: overlay.layout[layer].get(id) ?? action,
isApplied: !overlay.layout[layer].has(id),
action: overlay.layout[layer]?.get(id) ?? action,
isApplied: !overlay.layout[layer]?.has(id),
})) as [KeyInfo, KeyInfo, KeyInfo],
),
);
@@ -118,7 +118,7 @@ export const chords = derived([overlay, deviceChords], ([overlay, chords]) => {
return {
id: chord.actions,
// use the old phrase for stable editing
sortBy: chord.phrase.map((it) => KEYMAP_CODES[it]?.id ?? it).join(),
sortBy: chord.phrase.map((it) => KEYMAP_CODES.get(it)?.id ?? it).join(),
actions: changedChord.actions,
phrase: changedChord.phrase,
actionsChanged: id !== JSON.stringify(changedChord.actions),
@@ -130,7 +130,7 @@ export const chords = derived([overlay, deviceChords], ([overlay, chords]) => {
} else {
return {
id: chord.actions,
sortBy: chord.phrase.map((it) => KEYMAP_CODES[it]?.id ?? it).join(),
sortBy: chord.phrase.map((it) => KEYMAP_CODES.get(it)?.id ?? it).join(),
actions: chord.actions,
phrase: chord.phrase,
phraseChanged: false,