Skip to content

Commit 04d1ae8

Browse files
committed
[fix] compute correct depth offset
Fixes #122
1 parent bd6b5dd commit 04d1ae8

File tree

5 files changed

+23
-23
lines changed

5 files changed

+23
-23
lines changed

src/lib/components/filetree/Filetree.svelte

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
/** @type {import('svelte/store').Writable<Record<string, import('$lib/types').Stub>>} */
1111
export let endstate;
1212
13-
/** @type {{ prefix: string, depth: number, name: string }} */
13+
/** @type {import('svelte/store').Writable<import('$lib/types').Scope>} */
1414
export let scope;
1515
1616
/** @type {import('svelte/store').Writable<boolean>} */
@@ -33,6 +33,7 @@
3333
files,
3434
selected,
3535
readonly,
36+
scope,
3637
3738
select: async (file) => {
3839
selected.set(file);
@@ -166,12 +167,12 @@
166167

167168
<div class="filetree">
168169
<Folder
169-
prefix={scope.prefix}
170-
depth={scope.depth}
170+
prefix={$scope.prefix}
171+
depth={$scope.depth}
171172
directory={{
172173
type: 'directory',
173174
name: '',
174-
basename: scope.name
175+
basename: $scope.name
175176
}}
176177
files={$files.filter((stub) => !hidden.has(stub.basename))}
177178
expanded

src/lib/components/filetree/Folder.svelte

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@
2121
/** @type {'idle' | 'add_file' | 'add_directory' | 'renaming'} */
2222
let state = 'idle';
2323
24-
const { endstate, files: all_files, rename, add, remove, readonly } = context.get();
24+
const { endstate, files: all_files, rename, add, remove, readonly, scope } = context.get();
2525
2626
$: children = files
2727
.filter((file) => file.name.startsWith(prefix))
@@ -104,7 +104,7 @@
104104
].filter(Boolean);
105105
</script>
106106

107-
<div class="directory row" class:expanded style="--depth: {depth};">
107+
<div class="directory row" class:expanded style="--depth: {depth - $scope.depth};">
108108
<Item
109109
can_rename={can_remove}
110110
renaming={state === 'renaming'}
@@ -126,10 +126,10 @@
126126
</div>
127127

128128
{#if expanded}
129-
<ul style="--depth: {depth}">
129+
<ul style="--depth: {depth - $scope.depth}">
130130
{#if state === 'add_directory'}
131131
<li>
132-
<div class="directory row" style="--depth: {depth + 1}">
132+
<div class="directory row" style="--depth: {depth - $scope.depth + 1}">
133133
<Item
134134
renaming
135135
on:rename={(e) => {

src/lib/components/filetree/context.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import { setContext, getContext } from 'svelte';
66
* files: import('svelte/store').Writable<import('$lib/types').Stub[]>;
77
* selected: import('svelte/store').Writable<import('$lib/types').FileStub | null>;
88
* readonly: import('svelte/store').Writable<boolean>;
9+
* scope: import('svelte/store').Writable<import('$lib/types').Scope>;
910
* select: (file: import('$lib/types').FileStub) => void;
1011
* add: (name: string, type: 'file' | 'directory') => Promise<void>;
1112
* rename: (stub: import('$lib/types').Stub, name: string) => Promise<void>;

src/lib/types/index.d.ts

Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,12 @@ export interface Adapter {
2424
destroy(): Promise<void>;
2525
}
2626

27+
export interface Scope {
28+
prefix: string;
29+
depth: number;
30+
name: string;
31+
}
32+
2733
export interface Exercise {
2834
part: {
2935
slug: string;
@@ -34,11 +40,7 @@ export interface Exercise {
3440
slug: string;
3541
title: string;
3642
};
37-
scope: {
38-
prefix: string;
39-
depth: number;
40-
name: string;
41-
};
43+
scope: Scope;
4244
focus: string;
4345
title: string;
4446
slug: string;
@@ -49,7 +51,7 @@ export interface Exercise {
4951
editing_constraints: {
5052
create: string[];
5153
remove: string[];
52-
}
54+
};
5355
a: Record<string, Stub>;
5456
b: Record<string, Stub>;
5557
}
@@ -83,14 +85,6 @@ export interface PartStub {
8385
chapters: ChapterStub[];
8486
}
8587

86-
export interface FileTreeContext {
87-
select: (file: FileStub) => void;
88-
add: (name: string, type: 'file' | 'directory') => Promise<void>;
89-
edit: (stub: Stub, name: string) => Promise<void>;
90-
remove: (stub: Stub) => Promise<void>;
91-
selected: Writable<FileStub | null>;
92-
}
93-
9488
export interface EditingConstraints {
9589
create: string[];
9690
remove: string[];

src/routes/tutorial/[slug]/+page.svelte

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -27,6 +27,9 @@
2727
/** @type {import('svelte/store').Writable<import('$lib/types').FileStub | null>} */
2828
const selected = writable(null);
2929
30+
/** @type {import('svelte/store').Writable<import('$lib/types').Scope>} */
31+
const scope = writable({ depth: 0, name: '', prefix: '' });
32+
3033
/** @type {HTMLIFrameElement} */
3134
let iframe;
3235
let loading = true;
@@ -159,6 +162,7 @@
159162
async function load_exercise() {
160163
try {
161164
$files = Object.values(data.exercise.a);
165+
$scope = data.exercise.scope;
162166
selected.set(
163167
/** @type {import('$lib/types').FileStub} */ (
164168
$files.find((stub) => stub.name === data.exercise.focus)
@@ -348,7 +352,7 @@
348352
<SplitPane type="horizontal" min="80px" max="300px" pos="200px">
349353
<section class="navigator" slot="a">
350354
<Filetree
351-
scope={data.exercise.scope}
355+
{scope}
352356
{endstate}
353357
{files}
354358
readonly={mobile}

0 commit comments

Comments
 (0)