Skip to content

Commit

Permalink
dataPieces within same page should be rendered with stable order
Browse files Browse the repository at this point in the history
fix: #80
  • Loading branch information
csr632 committed Aug 30, 2022
1 parent f1f492b commit 02ecd28
Show file tree
Hide file tree
Showing 4 changed files with 48 additions and 26 deletions.
29 changes: 19 additions & 10 deletions packages/create-project/template-lib/docs/vite.config.ts
Original file line number Diff line number Diff line change
Expand Up @@ -28,10 +28,17 @@ module.exports = {
if (!match) throw new Error('unexpected file: ' + absolute)
const [_, componentName, demoName] = match
const pageId = `/components/demos/${componentName}`
// set page data
const runtimeDataPaths = api.getRuntimeData(pageId)
// the ?demo query will wrap the module with useful demoInfo
runtimeDataPaths[demoName] = `${absolute}?demo`
// register page data
api.addPageData({
pageId,
key: demoName,
// register demo runtime data path
// the ?demo query will wrap the module with useful demoInfo
// that will be consumed by theme-doc
dataPath: `${absolute}?demo`,
// register demo static data
staticData: await helpers.extractStaticData(file),
})
}
)
}
Expand All @@ -46,12 +53,14 @@ module.exports = {
if (!match) throw new Error('unexpected file: ' + absolute)
const [_, componentName] = match
const pageId = `/components/${componentName}`
// set page data
const runtimeDataPaths = api.getRuntimeData(pageId)
runtimeDataPaths.main = absolute
// set page staticData
const staticData = api.getStaticData(pageId)
staticData.main = await helpers.extractStaticData(file)
// register page data
api.addPageData({
pageId,
// register demo runtime data path
dataPath: absolute,
// register demo static data
staticData: await helpers.extractStaticData(file),
})
}
)
},
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
/**
* @title Button Demo1 Title
* @description Button demo1 description
* @order 1
*/

import React from 'react'
Expand Down
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
/**
* @title Button Demo2 Title
* @description Button demo2 description
* @order 2
*/

import React from 'react'
Expand Down
43 changes: 27 additions & 16 deletions packages/theme-doc/src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -52,22 +52,33 @@ export function createTheme(themeConfig: ThemeConfig): React.FC<ThemeProps> {
}

const pageStaticData = staticData[loadState.routePath]
const body = Object.entries(pageData).map(([key, dataPart], idx) => {
const ContentComp = (dataPart as any).default
const pageStaticDataPart = pageStaticData?.[key]
const content = (() => {
if (pageStaticDataPart?.sourceType === 'md')
return (
<MDX>
<ContentComp />
</MDX>
)
if (dataPart?.isDemo)
return <Demo style={{ margin: '16px 45px' }} {...dataPart} />
return <ContentComp />
})()
return <React.Fragment key={key}>{content}</React.Fragment>
})

const body = Object.entries(pageData)
.map(([key, dataPart], idx) => {
const ContentComp = (dataPart as any).default
const pageStaticDataPart = pageStaticData?.[key]
const content = (() => {
if (pageStaticDataPart?.sourceType === 'md')
return (
<MDX>
<ContentComp />
</MDX>
)
if (dataPart?.isDemo)
return <Demo style={{ margin: '16px 45px' }} {...dataPart} />
return <ContentComp />
})()
const result = <React.Fragment key={key}>{content}</React.Fragment>
let order = Number(pageStaticDataPart?.order || 1)
if (Number.isNaN(order)) order = 1
return { key, result, order }
})
.sort((a, b) => {
// sort by (order, key)
if (a.order !== b.order) return a.order - b.order
return a.key.localeCompare(b.key)
})
.map(({ result }) => result)

return <AppLayout>{body}</AppLayout>
}
Expand Down

0 comments on commit 02ecd28

Please sign in to comment.