現状、articlesディレクトリ直下にしかMDファイルを配置できないため、記事がたくさんあるときにエディタのファイルツリーでもzenn-editorのUI上でも記事の検索性が悪くなってしまっています。
そこで、articlesディレクトリ内にあるサブディレクトリ内のMDも検知できるようにし、zenn-editorのUIでは「articles」のアコーディオンのように、ディレクトリ名をクリックして展開できるようなUIを追加してほしいです。
もしかしたらZennとの同期部分でZenn本体側の修正が必要かもしれませんが...。
「articles」アコーディオン

現状

ファイルの読み込みはここらへんっぽい
|
function getArticleFilenames(sort?: ItemSortType): string[] { |
|
const dirpath = getWorkingPath('articles'); |
|
const allFiles = |
|
sort === 'system' |
|
? listFilenames(dirpath) |
|
: listFilenamesOrderByModified(dirpath); |
|
if (allFiles === null) { |
|
Log.error( |
|
'プロジェクトルートの articles ディレクトリを取得できませんでした。`npx zenn init`を実行して作成してください' |
|
); |
|
return []; |
|
} |
|
// filter markdown files |
|
return allFiles.filter((f) => /\.md$/.test(f)); // `.md`で終わるファイルのみに絞り込む |
|
} |
UIはここらへん
|
const ListArticles: React.FC<{ sort: ItemSortType }> = ({ sort }) => { |
|
const { data, mutate } = useFetch<{ articles: ArticleMeta[] }>( |
|
`/api/articles?sort=${sort}`, |
|
{ |
|
revalidateOnFocus: false, |
|
errorRetryCount: 3, |
|
} |
|
); |
|
const articles = data?.articles; |
|
|
|
// refetch when local file changes |
|
useLocalFileChangedEffect(() => { |
|
mutate(); |
|
}); |
|
|
|
return ( |
|
<Directory title="articles" uniqueKey="dir-articles" defaultOpen={true}> |
|
<ul> |
|
{!!articles?.length && ( |
|
<li> |
|
{articles.map((article) => ( |
|
<ArticleLinkItem |
|
key={`item-article-${article.slug}`} |
|
article={article} |
|
/> |
|
))} |
|
</li> |
|
)} |
|
</ul> |
|
</Directory> |
|
); |
|
}; |
API
|
export function getArticles(req: Express.Request, res: Express.Response) { |
|
const sort = getValidSortTypes(req.query.sort); |
|
const articles = getLocalArticleMetaList(sort); |
|
res.json({ articles }); |
|
} |
現状、articlesディレクトリ直下にしかMDファイルを配置できないため、記事がたくさんあるときにエディタのファイルツリーでもzenn-editorのUI上でも記事の検索性が悪くなってしまっています。
そこで、articlesディレクトリ内にあるサブディレクトリ内のMDも検知できるようにし、zenn-editorのUIでは「articles」のアコーディオンのように、ディレクトリ名をクリックして展開できるようなUIを追加してほしいです。
もしかしたらZennとの同期部分でZenn本体側の修正が必要かもしれませんが...。
「articles」アコーディオン

現状

ファイルの読み込みはここらへんっぽい
zenn-editor/packages/zenn-cli/src/server/lib/articles.ts
Lines 47 to 61 in 91d282d
UIはここらへん
zenn-editor/packages/zenn-cli/src/client/components/Sidebar.tsx
Lines 115 to 146 in 91d282d
API
zenn-editor/packages/zenn-cli/src/server/api/articles.ts
Lines 17 to 21 in 91d282d