Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

@tsimons/gatsby-plugin-elasticlunr-search

Package Overview
Dependencies
Maintainers
1
Versions
2
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@tsimons/gatsby-plugin-elasticlunr-search - npm Package Compare versions

Comparing version 1.0.3 to 1.0.4

4

gatsby-node.js

@@ -107,3 +107,3 @@ "use strict";

} = boundActionCreators;
const existingNodes = getNodes().filter(n => n.internal.owner === `@andrew-codes/gatsby-plugin-elasticlunr-search`);
const existingNodes = getNodes().filter(n => n.internal.owner === `@tsimons/gatsby-plugin-elasticlunr-search`);
existingNodes.forEach(n => touchNode(n.id));

@@ -125,3 +125,3 @@ };

if (filter && !filter(node)) {
if (filter && !filter(node, getNode)) {
return;

@@ -128,0 +128,0 @@ }

{
"name": "@tsimons/gatsby-plugin-elasticlunr-search",
"version": "1.0.3",
"version": "1.0.4",
"description":
"Search for gatsby; implemented via elastic lunr. Forked from https://www.npmjs.com/package/@andrew-codes/gatsby-plugin-elasticlunr-search",
"Search for gatsby; implemented via elastic lunr. Forked from @andrew-codes/gatsby-plugin-elasticlunr-search",
"main": "index.js",

@@ -13,13 +13,12 @@ "scripts": {

"type": "git",
"url": "git+https://github.com/andrew-codes/gatsby-plugin-search.git"
"url": "git+https://github.com/tsimons/gatsby-plugin-search.git"
},
"keywords": ["gatsby", "gatsby-plugin", "lunr", "search", "elastic lunr"],
"author":
"TJ Simons <tjsimons@invisionapp.com>, Andrew Smith <andrew@andrew.codes>",
"Andrew Smith <andrew@andrew.codes>, TJ Simons <t.simons88@gmail.com>",
"license": "MIT",
"bugs": {
"url": "https://github.com/tsimons/gatsby-plugin-elasticlunr-search"
"url": "https://github.com/tsimons/gatsby-plugin-search/issues"
},
"homepage":
"https://github.com/tsimons/gatsby-plugin-elasticlunr-search#readme",
"homepage": "https://github.com/tsimons/gatsby-plugin-search#readme",
"devDependencies": {

@@ -26,0 +25,0 @@ "@babel/cli": "^7.0.0-beta.32",

[![Maintainability](https://api.codeclimate.com/v1/badges/124348de2ee6850d682f/maintainability)](https://codeclimate.com/github/andrew-codes/gatsby-plugin-elasticlunr-search/maintainability)
[![Codacy Badge](https://api.codacy.com/project/badge/Grade/7230ae7191f44a9489834553760310c2)](https://www.codacy.com/app/andrew-codes/gatsby-plugin-elasticlunr-search?utm_source=github.com&amp;utm_medium=referral&amp;utm_content=andrew-codes/gatsby-plugin-elasticlunr-search&amp;utm_campaign=Badge_Grade)
[![Codacy Badge](https://api.codacy.com/project/badge/Grade/7230ae7191f44a9489834553760310c2)](https://www.codacy.com/app/andrew-codes/gatsby-plugin-elasticlunr-search?utm_source=github.com&utm_medium=referral&utm_content=andrew-codes/gatsby-plugin-elasticlunr-search&utm_campaign=Badge_Grade)
# Search Plugin for Gatsby
This plugin enables search integration via elastic lunr. Content is indexed and then made available via graphql to rehydrate into an `elasticlunr` index. From there, queries can be made against this index to retrieve pages by their ID.

@@ -13,4 +14,22 @@

## Setup in `gatsby-config`
## Usage
In order to add documents to the search index, you will need to inform the plugin which types of documents are relevant to your search needs. If you are unsure of the exact type, open gatsby's graphiql endpoint via a web browser of the graphiql app. Search the docs explorer for you schema, then perform a query on it like so:
```
query GetTypeQuery {
wordpress__POST {
internal {
type
}
}
}
```
The output of type is what you will use in your resolver as demonstrated below.
### Basic Example
```javascript
// gatsby-config.js
module.exports = {

@@ -22,6 +41,3 @@ plugins: [

// Fields to index
fields: [
'title',
'keywords',
],
fields: ['title', 'keywords'],
// How to resolve each field's value for a supported node type

@@ -32,25 +48,116 @@ resolvers: {

title: node => node.frontmatter.title,
keywords: node => node.frontmatter.keywords,
},
keywords: node => node.frontmatter.keywords
}
}
}
}
]
};
```
### Resolve relational Data
Some data sources store necesary fields in foreign nodes. One example of this is WordPress. It store categories, tags, authors, and posts in separate DB tables/rows. Gatsby handles stitching these together for you. However, at this stage of the build, it only has the ID of the node it relates to. In order to add the data from the related node, we will need to resolve it ourselves. Below is an example of adding the author name to the document in the search index for a wordpress poet.
```javascript
// gatsby-config.js
module.exports = {
plugins: [
{
resolve: `@andrew-codes/gatsby-plugin-elasticlunr-search`,
options: {
// Fields to index
fields: ['title', 'author'],
// How to resolve each field's value for a supported node type
resolvers: {
// For any node of type wordpress__POST, list how to resolve the fields' values
wordpress__POST: {
title: node => node.title,
author: (node, getNode) =>
getNode(node.author___NODE).name
}
}
}
}
]
};
```
### Filter nodes that are added to the index
gatsby-plugin-elasticlunr-search allows you to filter the nodes that go in to the index to avoid unnecessary memory usage.
```javascript
// gatsby-config.js
module.exports = {
plugins: [
{
resolve: `@andrew-codes/gatsby-plugin-elasticlunr-search`,
options: {
// Fields to index
fields: ['title', 'keywords'],
// How to resolve each field's value for a supported node type
resolvers: {
// For any node of type MarkdownRemark, list how to resolve the fields' values
MarkdownRemark: {
title: node => node.frontmatter.title,
keywords: node => node.frontmatter.keywords
}
},
},
},
],
filter: (node, getNode) => node.post_type !== 'page'
}
}
]
};
```
### Filter nodes that are added to the index, based on props of another node
```javascript
// gatsby-config.js
module.exports = {
plugins: [
{
resolve: `@andrew-codes/gatsby-plugin-elasticlunr-search`,
options: {
// Fields to index
fields: ['title', 'keywords'],
// How to resolve each field's value for a supported node type
resolvers: {
// For any node of type MarkdownRemark, list how to resolve the fields' values
MarkdownRemark: {
title: node => node.frontmatter.title,
keywords: node => node.frontmatter.keywords
}
},
filter: (node, getNode) => {
const categoryIds = node.category___NODE;
const categoryNames = categoryIds.map(
id => getNode(id).name
);
return !categorynames.includes('no-search');
}
}
}
]
};
```
## Consuming in Your Site
The serialized search index will be available via graphql. Once queried, a component can create a new elastic lunr index with the value retrieved from the graphql query. Search queries can be made against the hydrated search index. The results is an array of document IDs. The index can return the full document given a document ID
```javascript
import React, {Component} from 'react';
import {Index} from 'elasticlunr';
import React, { Component } from 'react';
import { Index } from 'elasticlunr';
// Graphql query used to retrieve the serialized search index.
export const query = graphql`query
SearchIndexExampleQuery {
siteSearchIndex {
index
export const query = graphql`
query SearchIndexExampleQuery {
siteSearchIndex {
index
}
}
}`;
`;

@@ -63,3 +170,3 @@ // Search component

query: ``,
results: [],
results: []
};

@@ -71,3 +178,7 @@ }

<div>
<input type="text" value={this.state.query} onChange={this.search}/>
<input
type="text"
value={this.state.query}
onChange={this.search}
/>
<ul>

@@ -84,8 +195,9 @@ {this.state.results.map(page => (

getOrCreateIndex = () => this.index
? this.index
// Create an elastic lunr index and hydrate with graphql query results
: Index.load(this.props.data.siteSearchIndex.index);
getOrCreateIndex = () =>
this.index
? this.index
: // Create an elastic lunr index and hydrate with graphql query results
Index.load(this.props.data.siteSearchIndex.index);
search = (evt) => {
search = evt => {
const query = evt.target.value;

@@ -96,10 +208,9 @@ this.index = this.getOrCreateIndex();

// Query the index with search string to get an [] of IDs
results: this.index.search(query)
results: this.index
.search(query)
// Map over each ID and return the full document
.map(({
ref,
}) => this.index.documentStore.getDoc(ref)),
.map(({ ref }) => this.index.documentStore.getDoc(ref))
});
}
};
}
```
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc