Improve collection search
This commit is contained in:
parent
4fe0b6da65
commit
9dda0afb72
5 changed files with 71 additions and 28 deletions
|
@ -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(
|
||||||
|
|
|
@ -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);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -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 !== "") {
|
||||||
|
|
|
@ -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"
|
||||||
|
|
|
@ -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;
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in a new issue