Improve collection search

This commit is contained in:
dominik-zeglen 2019-11-25 15:57:50 +01:00
parent 4fe0b6da65
commit 9dda0afb72
5 changed files with 71 additions and 28 deletions

View file

@ -9,6 +9,7 @@ import { productUrl } from "@saleor/products/urls";
import { SearchCatalog } from "../queries/types/SearchCatalog"; import { SearchCatalog } from "../queries/types/SearchCatalog";
import { QuickSearchAction, QuickSearchActionInput } from "../types"; import { QuickSearchAction, QuickSearchActionInput } from "../types";
import messages from "./messages"; import messages from "./messages";
import { sortScores } from "./utils";
const threshold = 0.05; const threshold = 0.05;
const maxActions = 5; const maxActions = 5;
@ -22,40 +23,65 @@ export function searchInCatalog(
const categories: QuickSearchActionInput[] = maybe( const categories: QuickSearchActionInput[] = maybe(
() => catalog.categories.edges.map(edge => edge.node), () => catalog.categories.edges.map(edge => edge.node),
[] []
).map(category => ({ )
caption: intl.formatMessage(messages.category), .map<QuickSearchActionInput>(category => ({
label: category.name, caption: intl.formatMessage(messages.category),
onClick: () => navigate(categoryUrl(category.id)), label: category.name,
score: score(category.name, search), onClick: () => navigate(categoryUrl(category.id)),
text: category.name, score: score(category.name, search),
type: "catalog" text: category.name,
})); type: "catalog"
}))
.sort(sortScores);
const collections: QuickSearchActionInput[] = maybe( const collections: QuickSearchActionInput[] = maybe(
() => catalog.collections.edges.map(edge => edge.node), () => catalog.collections.edges.map(edge => edge.node),
[] []
).map(collection => ({ )
caption: intl.formatMessage(messages.collection), .map<QuickSearchActionInput>(collection => ({
label: collection.name, caption: intl.formatMessage(messages.collection),
onClick: () => navigate(collectionUrl(collection.id)), extraInfo: intl.formatMessage(
score: score(collection.name, search), collection.isPublished
text: collection.name, ? messages.collectionPublished
type: "catalog" : messages.collectionUnpublished
})); ),
label: collection.name,
onClick: () => navigate(collectionUrl(collection.id)),
score: score(collection.name, search),
text: collection.name,
type: "catalog"
}))
.sort(sortScores);
const products: QuickSearchActionInput[] = maybe( const products: QuickSearchActionInput[] = maybe(
() => catalog.products.edges.map(edge => edge.node), () => catalog.products.edges.map(edge => edge.node),
[] []
).map(product => ({ )
caption: intl.formatMessage(messages.product), .map<QuickSearchActionInput>(product => ({
label: product.name, caption: intl.formatMessage(messages.product),
onClick: () => navigate(productUrl(product.id)), extraInfo: product.category.name,
score: score(product.name, search), label: product.name,
text: product.name, onClick: () => navigate(productUrl(product.id)),
type: "catalog" score: score(product.name, search),
})); text: product.name,
type: "catalog"
}))
.sort(sortScores);
return [...categories, ...collections, ...products]; const baseActions = [
...categories.slice(0, 1),
...collections.slice(0, 1),
...products.slice(0, 1)
];
return [
...baseActions,
...[
...categories.slice(1),
...collections.slice(1),
...products.slice(1)
].sort(sortScores)
].sort(sortScores);
} }
function getCatalogModeActions( function getCatalogModeActions(

View file

@ -11,6 +11,7 @@ import { productAddUrl } from "@saleor/products/urls";
import { MutationFunction } from "react-apollo"; import { MutationFunction } from "react-apollo";
import { QuickSearchActionInput } from "../../types"; import { QuickSearchActionInput } from "../../types";
import messages from "../messages"; import messages from "../messages";
import { sortScores } from "../utils";
const threshold = 0.05; const threshold = 0.05;
const maxActions = 5; const maxActions = 5;
@ -69,7 +70,7 @@ function getCommandModeActions(
): QuickSearchActionInput[] { ): QuickSearchActionInput[] {
return [...searchInCommands(query, intl, navigate, createOrder)] return [...searchInCommands(query, intl, navigate, createOrder)]
.filter(action => action.score >= threshold) .filter(action => action.score >= threshold)
.sort((a, b) => (a.score <= b.score ? 1 : -1)) .sort(sortScores)
.slice(0, maxActions); .slice(0, maxActions);
} }

View file

@ -7,6 +7,7 @@ import { SearchCustomers_search_edges_node } from "@saleor/searches/types/Search
import { QuickSearchAction } from "../../types"; import { QuickSearchAction } from "../../types";
import { searchInCommands } from "../commands"; import { searchInCommands } from "../commands";
import { searchInCustomers } from "../customers"; import { searchInCustomers } from "../customers";
import { sortScores } from "../utils";
import searchInViews from "./views"; import searchInViews from "./views";
const threshold = 0.05; const threshold = 0.05;
@ -24,7 +25,7 @@ function getDefaultModeActions(
...searchInCommands(query, intl, navigate, createOrder) ...searchInCommands(query, intl, navigate, createOrder)
] ]
.filter(action => action.score >= threshold) .filter(action => action.score >= threshold)
.sort((a, b) => (a.score <= b.score ? 1 : -1)) .sort(sortScores)
.slice(0, maxActions); .slice(0, maxActions);
if (query !== "") { if (query !== "") {

View file

@ -29,6 +29,14 @@ const messages = defineMessages({
defaultMessage: "Collection", defaultMessage: "Collection",
description: "catalog item type" description: "catalog item type"
}, },
collectionPublished: {
defaultMessage: "Published",
description: "collection"
},
collectionUnpublished: {
defaultMessage: "Not Published",
description: "collection"
},
createOrder: { createOrder: {
defaultMessage: "Create Order", defaultMessage: "Create Order",
description: "button" description: "button"

View file

@ -1,4 +1,4 @@
import { QuickSearchAction } from "../types"; import { QuickSearchAction, QuickSearchActionInput } from "../types";
export function getActions(actions: QuickSearchAction[]): QuickSearchAction[] { export function getActions(actions: QuickSearchAction[]): QuickSearchAction[] {
return actions.filter(action => action.type === "action"); return actions.filter(action => action.type === "action");
@ -29,3 +29,10 @@ export function getCatalog(actions: QuickSearchAction[]): QuickSearchAction[] {
export function hasCatalog(actions: QuickSearchAction[]): boolean { export function hasCatalog(actions: QuickSearchAction[]): boolean {
return getCatalog(actions).length > 0; return getCatalog(actions).length > 0;
} }
export function sortScores(
a: QuickSearchActionInput,
b: QuickSearchActionInput
) {
return a.score <= b.score ? 1 : -1;
}