@compiiile/compiiile 2.5.0 → 2.7.0

package/README.md

@@ -156,24 +156,25 @@ Other frontmatter keys are handled:
 
 ### Routing
 
-The home page of Compiiile (`/`) points to a `README.md` file located at the root of your folder.
+The home page of Compiiile (`/`) points to a `README.md` file located at the root of your folder, or fallbacks to an `index.md` file.
 
 ## Custom configuration
 
 Here is the list of parameters that you can set to customize Compiiile (none are required):
 
-| Parameter              | Type       | Description                                                                                                 |
-| ---------------------- | ---------- | ----------------------------------------------------------------------------------------------------------- |
-| `title`                | `string`   | The title to display on the top-left of the User Interface                                                  |
-| `description`          | `string`   | The description that is rendered by default for the SEO                                                     |
-| `logo`                 | `string`   | The relative path of the logo to display in the TopBar and as favicon                                       |
-| `logoUrl`              | `string`   | The url to go to when clicking on the logo, defaults to the home page if not set                            |
-| `dest`                 | `string`   | The folder in which to build files, defaults to `./.compiiile/dist`                                         |
-| `siteUrl`              | `string`   | The url of the website in production (without trailing slash), used for the SEO tag `og:image`              |
-| `astroConfig`          | `Object`   | Override [default Astro config](https://docs.astro.build/en/reference/configuration-reference/)             |
-| `data`                 | `Object`   | An object with data to use in MDX files (check use case below)                                              |
-| `theme`                | `string`   | The website theme, value can be : `auto` (default value: adapts to system preferences) \| `light` \| `dark` |
-| `vite.server.fs.allow` | `string[]` | Add local paths to vite's server fs allow list                                                              |
+| Parameter              | Type       | Description                                                                                                          |
+| ---------------------- | ---------- | -------------------------------------------------------------------------------------------------------------------- |
+| `title`                | `string`   | The title to display on the top-left of the User Interface                                                           |
+| `description`          | `string`   | The description that is rendered by default for the SEO                                                              |
+| `logo`                 | `string`   | The relative path of the logo to display in the TopBar and as favicon                                                |
+| `logoUrl`              | `string`   | The url to go to when clicking on the logo, defaults to the home page if not set                                     |
+| `dest`                 | `string`   | The folder in which to build files, defaults to `./.compiiile/dist`                                                  |
+| `siteUrl`              | `string`   | The url of the website in production (without trailing slash), used for the SEO tag `og:image`                       |
+| `astroConfig`          | `Object`   | Override [default Astro config](https://docs.astro.build/en/reference/configuration-reference/)                      |
+| `data`                 | `Object`   | An object with data to use in MDX files (check use case below)                                                       |
+| `theme`                | `string`   | The website theme, value can be : `auto` (default value: adapts to system preferences) \| `light` \| `dark`          |
+| `useAutoTitles`        | `Boolean`  | If set to `true`, use the first file heading as title to be displayed in the navbar and for SEO. Defaults to `false` |
+| `vite.server.fs.allow` | `string[]` | Add local paths to vite's server fs allow list                                                                       |
 
 You can use these parameters in 2 ways:
 

package/bin/config.js

@@ -53,6 +53,7 @@ process.env.VITE_COMPIIILE_LOGO_URL = argv.logoUrl ?? ""
 process.env.VITE_COMPIIILE_THEME = argv.theme ?? "auto"
 
 process.env.VITE_COMPIIILE_DATA = JSON.stringify(argv.data ?? {})
+process.env.VITE_COMPIIILE_USE_AUTO_TITLES = /true/i.test(argv.useAutoTitles) // defaults to `false` if not set or not equal to `true`
 
 // Handling logo and favicon
 process.env.VITE_COMPIIILE_LOGO = null

package/bin/vitePluginCompiiile/models/Context.js

@@ -32,14 +32,14 @@ export default class {
 		}
 	}
 
-	generateRoutePathFromFilePath(filePath, hash = "", asSlides = false) {
+	generateRoutePathFromFilePath(filePath, hash = "", asSlides = false, entryFileMatcher) {
 		const filePathWithoutExtension = filePath.substring(0, filePath.lastIndexOf("."))
 		const sluggifiedPath = filePathWithoutExtension
 			.split("/")
 			.map((val) => slugify(val, { lower: true }))
 			.join("/")
 
-		if (sluggifiedPath === "readme") {
+		if (sluggifiedPath.match(entryFileMatcher)) {
 			if (process.env.VITE_COMPIIILE_BASE !== "/") {
 				return process.env.VITE_COMPIIILE_BASE
 			}
@@ -63,6 +63,8 @@ export default class {
 
 		const files = fs.readdirSync(directoryPath).sort(collator.compare)
 
+		const entryFileMatcher = files.find((file) => file.toLowerCase() === "readme.md") ? /readme/ : /index/
+
 		for (let file of files) {
 			if (
 				![
@@ -81,7 +83,9 @@ export default class {
 				const isDirectory = fs.statSync(filePath).isDirectory()
 				const uuid = uuidv4()
 				const fileName = path.parse(filePath).name
-				const isReadmeFile = !isDirectory && filePath.toLowerCase().match(/^readme\.mdx?$/)
+				const isReadmeFile =
+					!isDirectory &&
+					filePath.toLowerCase().match(new RegExp(/^/.source + entryFileMatcher.source + /\.mdx?$/.source))
 
 				let filesTreeItem = new FilesTreeItem(uuid, fileName)
 
@@ -116,12 +120,31 @@ export default class {
 
 						const meta = renderedMarkdown.metadata.frontmatter
 
-						fileListItem.title = meta.title || fileName
+						let firstHeading = null
+						if (
+							JSON.parse(process.env.VITE_COMPIIILE_USE_AUTO_TITLES) &&
+							renderedMarkdown.metadata.headings.length > 0
+						) {
+							let firstHeadingIndex = 0
+							if (Object.keys(renderedMarkdown.metadata.frontmatter).length > 0) {
+								// If a frontmatter is set, it is present as the first index in the `headings` array
+								firstHeadingIndex = 1
+							}
+							// Remove the starting '#' from the title
+							firstHeading = renderedMarkdown.metadata.headings[firstHeadingIndex]?.text?.slice(1)
+						}
+
+						fileListItem.title = meta.title || firstHeading || fileName
 						fileListItem.meta = meta
 						fileListItem.meta.title = fileListItem.meta.title || fileListItem.title
 						fileListItem.fullPath = filePath
 
-						const routePath = this.generateRoutePathFromFilePath(filePath, "", fileListItem.meta.asSlides)
+						const routePath = this.generateRoutePathFromFilePath(
+							filePath,
+							"",
+							fileListItem.meta.asSlides,
+							entryFileMatcher
+						)
 
 						if (isReadmeFile) {
 							this.fileList.unshift(fileListItem)

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@compiiile/compiiile",
 	"private": false,
-	"version": "2.5.0",
+	"version": "2.7.0",
 	"description": "The most convenient way to render a folder containing markdown files. Previewing and searching markdown files has never been that easy.",
 	"author": "AlbanCrepel <alban.crepel@gmail.com>",
 	"license": "GPL-3.0-only",