Skip to content

Commit

Permalink
feat(v2): Algolia search theme (#1440)
Browse files Browse the repository at this point in the history
* feat(v2): Algolia search plugin

* patch PR #1440 (#1441)

* alternative implementation

* typo

* refactor noop

* rename SearchAlgolia -> SearchBar

* changes.md
  • Loading branch information
yangshun authored and endiliey committed May 8, 2019
1 parent 8aef4ec commit 384fd57
Show file tree
Hide file tree
Showing 14 changed files with 116 additions and 44 deletions.
3 changes: 3 additions & 0 deletions packages/docusaurus-preset-classic/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,9 @@ module.exports = function preset(context, opts = {}) {
{
name: '@docusaurus/theme-classic',
},
{
name: '@docusaurus/theme-search-algolia',
},
],
plugins: [
{
Expand Down
4 changes: 2 additions & 2 deletions packages/docusaurus-theme-classic/src/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ const path = require('path');

const DEFAULT_OPTIONS = {};

class DocusaurusThemeDefault {
class DocusaurusThemeClassic {
constructor(context, opts) {
this.options = {...DEFAULT_OPTIONS, ...opts};
this.context = context;
Expand All @@ -24,4 +24,4 @@ class DocusaurusThemeDefault {
}
}

module.exports = DocusaurusThemeDefault;
module.exports = DocusaurusThemeClassic;
12 changes: 7 additions & 5 deletions packages/docusaurus-theme-classic/src/theme/Navbar/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -10,17 +10,17 @@ import React from 'react';
import Link from '@docusaurus/Link';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext';

import Search from '@theme/Search';
import SearchBar from '@theme/SearchBar';

function Navbar(props) {
function Navbar() {
const context = useDocusaurusContext();
const {siteConfig = {}} = context;
// TODO: navbar headerlinks should depends on theme, not siteConfig;
const {
baseUrl,
headerLinks,
headerIcon,
algolia,
themeConfig: {algolia},
title,
disableHeaderTitle,
} = siteConfig;
Expand All @@ -41,8 +41,9 @@ function Navbar(props) {
</div>
);
}

if (link.href) {
// set link to specified href
// Set link to specified href.
return (
<div key={link.label} className="navbar__item">
<Link to={link.href} className="navbar__link">
Expand All @@ -51,6 +52,7 @@ function Navbar(props) {
</div>
);
}

return null;
};

Expand All @@ -73,7 +75,7 @@ function Navbar(props) {
<div className="navbar__items navbar__items--right">
{algolia && (
<div className="navbar__search" key="search-box">
<Search {...props} />
<SearchBar />
</div>
)}
</div>
Expand Down
8 changes: 8 additions & 0 deletions packages/docusaurus-theme-classic/src/theme/SearchBar.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
/**
* Copyright (c) 2017-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

export {default} from '@docusaurus/Noop';
21 changes: 21 additions & 0 deletions packages/docusaurus-theme-search-algolia/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
{
"name": "@docusaurus/theme-search-algolia",
"version": "2.0.0-alpha.13",
"description": "Algolia search component for Docusaurus",
"main": "src/index.js",
"publishConfig": {
"access": "public"
},
"license": "MIT",
"dependencies": {
"docsearch.js": "^2.5.2"
},
"peerDependencies": {
"@docusaurus/core": "^2.0.0",
"react": "^16.8.4",
"react-dom": "^16.8.4"
},
"engines": {
"node": ">=8"
}
}
27 changes: 27 additions & 0 deletions packages/docusaurus-theme-search-algolia/src/index.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
/**
* Copyright (c) 2017-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

const path = require('path');

const DEFAULT_OPTIONS = {};

class DocusaurusThemeSearchAlgolia {
constructor(context, opts) {
this.options = {...DEFAULT_OPTIONS, ...opts};
this.context = context;
}

getName() {
return 'docusaurus-theme-search-algolia';
}

getThemePath() {
return path.resolve(__dirname, './theme');
}
}

module.exports = DocusaurusThemeSearchAlgolia;
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,9 @@ class Search extends React.Component {
componentDidMount() {
const {siteConfig = {}, metadata = {}} = this.context;
const {version: thisVersion, language: thisLanguage} = metadata;
const {algolia} = siteConfig;
const {
themeConfig: {algolia},
} = siteConfig;

// https://github.com/algolia/docsearch/issues/352
const isClient = typeof window !== 'undefined';
Expand Down
4 changes: 0 additions & 4 deletions packages/docusaurus/CHANGES.md
Original file line number Diff line number Diff line change
Expand Up @@ -15,10 +15,6 @@ headerLinks: [
{ url: "help", label: "Help" },
// Links to href destination/ external page
{ href: "https://github.com/", label: "GitHub" },
// Determines search bar position among links
{ search: true },
// Determines language drop down position among links
{ languages: true }
],
```

Expand Down
8 changes: 8 additions & 0 deletions packages/docusaurus/lib/client/exports/Noop.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
/**
* Copyright (c) 2017-present, Facebook, Inc.
*
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/

export default () => null;
38 changes: 21 additions & 17 deletions packages/docusaurus/lib/server/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -55,35 +55,39 @@ module.exports = async function load(siteDir, cliOptions = {}) {
// These can be overriden in plugins/ through component swizzling.
// However, we alias it here first as a fallback.
const themeFallback = path.resolve(__dirname, '../client/theme-fallback');
let themeAliases = await loadTheme(themeFallback);
const fallbackAliases = await loadTheme(themeFallback);

// create theme alias from plugins
await Promise.all(
// Create theme alias from plugins.
const pluginThemeAliases = await Promise.all(
plugins.map(async plugin => {
if (!plugin.getThemePath) {
return;
return null;
}
const aliases = await loadTheme(plugin.getThemePath());
themeAliases = {
...themeAliases,
...aliases,
};
return loadTheme(plugin.getThemePath());
}),
);

// user's own theme alias override. Highest priority
// User's own theme alias override. Highest priority.
const themePath = path.resolve(siteDir, 'theme');
const aliases = await loadTheme(themePath);
themeAliases = {
...themeAliases,
...aliases,
};
const userAliases = await loadTheme(themePath);

const combinedAliases = [
fallbackAliases,
...pluginThemeAliases,
userAliases,
].reduce(
(acc, curr) => ({
...acc,
...curr,
}),
{},
);

// Make a fake plugin to resolve alias theme.
// Make a fake plugin to resolve aliased theme components.
plugins.push({
configureWebpack: () => ({
resolve: {
alias: themeAliases,
alias: combinedAliases,
},
}),
});
Expand Down
2 changes: 1 addition & 1 deletion packages/docusaurus/lib/server/load/config.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,7 +23,6 @@ const REQUIRED_FIELDS = [
];

const OPTIONAL_FIELDS = [
'algolia',
'customFields',
'defaultLanguage',
'disableHeaderTitle',
Expand All @@ -32,6 +31,7 @@ const OPTIONAL_FIELDS = [
'markdownPlugins',
'plugins',
'presets',
'themeConfig',
];

const DEFAULT_CONFIG = {
Expand Down
19 changes: 9 additions & 10 deletions packages/docusaurus/lib/server/load/theme.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,16 +20,15 @@ module.exports = async function loadTheme(themePath) {
});

const alias = {};
await Promise.all(
themeComponentFiles.map(async relativeSource => {
const filePath = path.join(themePath, relativeSource);
const fileName = fileToPath(relativeSource);
const aliasName = posixPath(
normalizeUrl(['@theme', fileName]).replace(/\/$/, ''),
);
alias[aliasName] = filePath;
}),
);

themeComponentFiles.forEach(relativeSource => {
const filePath = path.join(themePath, relativeSource);
const fileName = fileToPath(relativeSource);
const aliasName = posixPath(
normalizeUrl(['@theme', fileName]).replace(/\/$/, ''),
);
alias[aliasName] = filePath;
});

return alias;
};
10 changes: 6 additions & 4 deletions website/docusaurus.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -19,10 +19,12 @@ module.exports = {
],
headerIcon: 'img/docusaurus.svg',
favicon: 'img/docusaurus.ico',
algolia: {
apiKey: '47ecd3b21be71c5822571b9f59e52544',
indexName: 'docusaurus-2',
algoliaOptions: {},
themeConfig: {
algolia: {
apiKey: '47ecd3b21be71c5822571b9f59e52544',
indexName: 'docusaurus-2',
algoliaOptions: {},
},
},
presets: [
[
Expand Down

0 comments on commit 384fd57

Please sign in to comment.