my blog https://overreacted.io
nit
+27
-18
+27
-18
public/impossible-components/index.md
+27
-18
public/impossible-components/index.md
···
986
986
987
987
<Server>
988
988
989
-
```js {6-11}
989
+
```js {9-13}
990
990
import { SortableList } from './client';
991
991
import { readdir } from 'fs/promises';
992
992
993
993
async function SortableFileList({ directory }) {
994
994
const files = await readdir(directory);
995
-
const items = files.map((file) => ({
996
-
id: file,
997
-
content: file,
998
-
searchText: file,
999
-
}));
1000
-
return <SortableList items={items} />;
995
+
return (
996
+
<SortableList
997
+
items={
998
+
files.map(file => ({
999
+
id: file,
1000
+
content: file,
1001
+
searchText: file,
1002
+
}))
1003
+
}
1004
+
/>
1005
+
);
1001
1006
}
1002
1007
```
1003
1008
···
1031
1036
1032
1037
<Server>
1033
1038
1034
-
```js {10-14}
1039
+
```js {11-15}
1035
1040
import { SortableList } from './client';
1036
1041
import { readdir } from 'fs/promises';
1037
1042
···
1041
1046
return (
1042
1047
<div className="mb-8 flex h-72 flex-col gap-2 overflow-scroll font-sans">
1043
1048
<SortableList
1044
-
items={dirs.map(dir => ({
1045
-
id: dir.name,
1046
-
searchText: dir.name.replaceAll('-', ' '),
1047
-
content: <PostPreview slug={dir.name} />
1048
-
}))}
1049
+
items={
1050
+
dirs.map(dir => ({
1051
+
id: dir.name,
1052
+
searchText: dir.name.replaceAll('-', ' '),
1053
+
content: <PostPreview slug={dir.name} />
1054
+
}))
1055
+
}
1049
1056
/>
1050
1057
</div>
1051
1058
);
···
1157
1164
return (
1158
1165
<div className="mb-8 flex h-72 flex-col gap-2 overflow-scroll font-sans">
1159
1166
<SortableList
1160
-
items={dirs.map(dir => ({
1161
-
id: dir.name,
1162
-
searchText: dir.name.replaceAll('-', ' '),
1163
-
content: <PostPreview slug={dir.name} />
1164
-
}))}
1167
+
items={
1168
+
dirs.map(dir => ({
1169
+
id: dir.name,
1170
+
searchText: dir.name.replaceAll('-', ' '),
1171
+
content: <PostPreview slug={dir.name} />
1172
+
}))
1173
+
}
1165
1174
/>
1166
1175
</div>
1167
1176
);