8000 chore: improve paraglide (#104) · sveltejs/cli@198a120 · GitHub
[go: up one dir, main page]
Skip to content

Commit 198a120

Browse files
AdrianGonz97AdrianGonz97
authored
chore: improve paraglide (#104)
1 parent 1abcf39 commit 198a120

File tree

4 files changed

+44
-50
lines changed

4 files changed

+44
-50
lines changed

‎.changeset/heavy-weeks-look.md

Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
---
2+
"sv": patch
3+
---
4+
5+
chore: improve paraglide

‎packages/adders/lucia/index.ts

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -291,7 +291,7 @@ export default defineAdder({
291291
return content;
292292
}
293293

294-
const { ts } = utils.createPrinter({ ts: typescript });
294+
const [ts] = utils.createPrinter(typescript);
295295
return dedent`
296296
import { fail, redirect } from '@sveltejs/kit';
297297
import { hash, verify } from '@node-rs/argon2';
@@ -434,7 +434,7 @@ export default defineAdder({
434434
return content;
435435
}
436436

437-
const { ts } = utils.createPrinter({ ts: typescript });
437+
const [ts] = utils.createPrinter(typescript);
438438
return dedent`
439439
<script ${ts(`lang='ts'`)}>
440440
import { enhance } from '$app/forms';
@@ -473,7 +473,7 @@ export default defineAdder({
473473
return content;
474474
}
475475

476-
const { ts } = utils.createPrinter({ ts: typescript });
476+
const [ts] = utils.createPrinter(typescript);
477477
return dedent`
478478
import { lucia } from '$lib/server/auth';
479479
import { fail, redirect } from '@sveltejs/kit';
@@ -514,7 +514,7 @@ export default defineAdder({
514514
return content;
515515
}
516516

517-
const { ts } = utils.createPrinter({ ts: typescript });
517+
const [ts] = utils.createPrinter(typescript);
518518
return dedent`
519519
<script ${ts(`lang='ts'`)}>
520520
import { enhance } from '$app/forms';

‎packages/adders/paraglide/index.ts

Lines changed: 30 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import fs from 'node:fs';
22
import path from 'node:path';
3-
import { defineAdder, defineAdderOptions, log, utils } from '@sveltejs/cli-core';
3+
import MagicString from 'magic-string';
4+
import { dedent, defineAdder, defineAdderOptions, log, utils } from '@sveltejs/cli-core';
45
import {
56
array,
67
common,
@@ -183,8 +184,8 @@ export default defineAdder({
183184
{
184185
// add the <ParaglideJS> component to the layout
185186
name: ({ kit }) => `${kit?.routesDirectory}/+layout.svelte`,
186-
content: ({ content, dependencyVersion }) => {
187-
const { script, template, generateCode } = parseSvelte(content);
187+
content: ({ content, dependencyVersion, typescript }) => {
188+
const { script, template, generateCode } = parseSvelte(content, { typescript });
188189

189190
const paraglideComponentName = 'ParaglideJS';
190191
imports.addNamed(script.ast, '@inlang/paraglide-sveltekit', {
@@ -194,28 +195,21 @@ export default defineAdder({
194195
i18n: 'i18n'
195196
});
196197

197-
// wrap the HTML in a ParaglideJS instance
198-
const rootChildren = template.ast.children;
199-
if (rootChildren.length === 0) {
198+
if (template.source.length === 0) {
200199
const svelteVersion = dependencyVersion('svelte');
201200
if (!svelteVersion) throw new Error('Failed to determine svelte version');
202201

203202
html.addSlot(script.ast, template.ast, svelteVersion);
204203
}
205204

206-
const hasParaglideJsNode = rootChildren.find(
207-
(x) => x.type == 'tag' && x.name == paraglideComponentName
208-
);
209-
if (!hasParaglideJsNode) {
210-
const root = html.element(paraglideComponentName, {});
211-
root.attribs = {
212-
'{i18n}': ''
213-
};
214-
root.children = rootChildren;
215-
template.ast.children = [root];
205+
const templateCode = new MagicString(template.generateCode());
206+
if (!templateCode.original.includes('<ParaglideJS')) {
207+
templateCode.indent();
208+
templateCode.prepend('<ParaglideJS {i18n}>\n');
209+
templateCode.append('\n</ParaglideJS>');
216210
}
217211

218-
return generateCode({ script: script.generateCode(), template: template.generateCode() });
212+
return generateCode({ script: script.generateCode(), template: templateCode.toString() });
219213
}
220214
},
221215
{
@@ -263,40 +257,41 @@ export default defineAdder({
263257
);
264258
}
265259

266-
const { ts } = utils.createPrinter({ ts: typescript });
260+
const [ts] = utils.createPrinter(typescript);
267261

268-
const methodStatement = common.statementFromString(`
262+
const scriptCode = new MagicString(script.generateCode());
263+
if (!scriptCode.original.includes('function switchToLanguage')) {
264+
scriptCode.trim();
265+
scriptCode.append('\n\n');
266+
scriptCode.append(dedent`
267+
${ts('', '/**')}
268+
${ts('', '* @param import("$lib/paraglide/runtime").AvailableLanguageTag newLanguage')}
269+
${ts('', '*/')}
269270
function switchToLanguage(newLanguage${ts(': AvailableLanguageTag')}) {
270271
const canonicalPath = i18n.route($page.url.pathname);
271272
const localisedPath = i18n.resolveRoute(canonicalPath, newLanguage);
272273
goto(localisedPath);
273274
}
274275
`);
275-
if (!typescript) {
276-
common.addJsDocComment(methodStatement, {
277-
'import("$lib/paraglide/runtime").AvailableLanguageTag': 'newLanguage'
278-
});
279276
}
280277

281-
script.ast.body.push(methodStatement);
278+
const templateCode = new MagicString(template.source);
282279

283280
// add localized message
284-
html.addFromRawHtml(
285-
template.ast.childNodes,
286-
`\n\n<h1>{m.hello_world({ name: 'SvelteKit User' })}</h1>\n`
287-
);
281+
templateCode.append("\n\n<h1>{m.hello_world({ name: 'SvelteKit User' })}</h1>\n");
288282

289283
// add links to other localized pages, the first one is the default
290284
// language, thus it does not require any localized route
291285
const { validLanguageTags } = parseLanguageTagInput(options.availableLanguageTags);
292286
const links = validLanguageTags
293-
.map((x) => `\n\t<button onclick="{() => switchToLanguage('${x}')}">${x}</button>`)
294-
.join('');
295-
const div = html.element('div');
296-
html.addFromRawHtml(div.childNodes, `${links}\n`);
297-
html.appendElement(template.ast.childNodes, div);
298-
299-
return generateCode({ script: script.generateCode(), template: template.generateCode() });
287+
.map(
288+
(x) =>
289+
`${templateCode.getIndentString()}<button onclick={() => switchToLanguage('${x}')}>${x}</button>`
290+
)
291+
.join('\n');
292+
templateCode.append(`<div>\n${links}\n</div>`);
293+
294+
return generateCode({ script: scriptCode.toString(), template: templateCode.toString() });
300295
}
301296
}
302297
],

‎packages/core/utils.ts

Lines changed: 5 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,7 @@
1-
type Printers<Condition extends Record<string, boolean>> = {
2-
[K in keyof Condition]: (content: string, alt?: string) => string;
3-
};
4-
export function createPrinter<Condition extends Record<string, boolean>>(
5-
conditions: Condition
6-
): Printers<Condition> {
7-
const printers = Object.entries(conditions).reduce((acc, [key, condition]) => {
8-
acc[key as keyof Condition] = (content: string, alt = '') => (condition ? content : alt);
9-
return acc;
10-
}, {} as Printers<Condition>);
11-
1+
type Printer = (content: string, alt?: string) => string;
2+
export function createPrinter(...conditions: boolean[]): Printer[] {
3+
const printers = conditions.map((condition) => {
4+
return (content: string, alt = '') => (condition ? content : alt);
5+
});
126
return printers;
137
}

0 commit comments

Comments
 (0)
0