Research
Security News
Quasar RAT Disguised as an npm Package for Detecting Vulnerabilities in Ethereum Smart Contracts
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
@tsimons/gatsby-plugin-elasticlunr-search
Advanced tools
Search for gatsby; implemented via elastic lunr. Forked from @andrew-codes/gatsby-plugin-elasticlunr-search
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.
Install the plugin via npm install -D @andrew-codes/gatsby-plugin-elasticlunr-search
. See the demo site repo for more specific implementation details.
Next, update your gatsby-config.js
file to utilize the plugin.
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.
// 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
}
}
}
}
]
};
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.
// 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
}
}
}
}
]
};
gatsby-plugin-elasticlunr-search allows you to filter the nodes that go in to the index to avoid unnecessary memory usage.
// 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'
}
}
]
};
// 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');
}
}
}
]
};
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
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
}
}
`;
// Search component
export default class Search extends Component {
constructor(props) {
super(props);
this.state = {
query: ``,
results: []
};
}
render() {
return (
<div>
<input
type="text"
value={this.state.query}
onChange={this.search}
/>
<ul>
{this.state.results.map(page => (
<li>
{page.title}: {page.keywords.join(`,`)}
</li>
))}
</ul>
</div>
);
}
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 => {
const query = evt.target.value;
this.index = this.getOrCreateIndex();
this.setState({
query,
// Query the index with search string to get an [] of IDs
results: this.index
.search(query)
// Map over each ID and return the full document
.map(({ ref }) => this.index.documentStore.getDoc(ref))
});
};
}
FAQs
Search for gatsby; implemented via elastic lunr. Forked from @andrew-codes/gatsby-plugin-elasticlunr-search
We found that @tsimons/gatsby-plugin-elasticlunr-search demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Socket researchers uncover a malicious npm package posing as a tool for detecting vulnerabilities in Etherium smart contracts.
Security News
Research
A supply chain attack on Rspack's npm packages injected cryptomining malware, potentially impacting thousands of developers.
Research
Security News
Socket researchers discovered a malware campaign on npm delivering the Skuld infostealer via typosquatted packages, exposing sensitive data.