-
+
diff --git a/src/lib/search.js b/src/lib/search.js
index d63989c..9a15199 100644
--- a/src/lib/search.js
+++ b/src/lib/search.js
@@ -106,10 +106,25 @@ export async function fetchGlobalSearchResults(query, limit, entities) {
return Object.fromEntries(entities.map((entity) => [ entity, json.search[entityConfigs[entity].plural || entity] ]));
}
-export async function fetchEntitySearchResults(query, limit, page, entity) {
- const parameters = generateEntitySearchParameters(entity);
+export async function fetchEntitySearchResults({
+ query,
+ entity,
+ page = 1,
+ limit = 15,
+ filters = {},
+ sortBy = null
+}) {
+ const parameters = [
+ ...generateEntitySearchParameters(entity),
+ ...generateFilterAndSortParameters(filters, sortBy)
+ ];
- const res = await fetch(`${baseUrl}/api/${entity}?${parameters.join("&")}&page[size]=${limit}&page[number]=${page}&q=${encodeURIComponent(query)}`);
+ let url = `${baseUrl}/api/${entity}?${parameters.join("&")}&page[size]=${limit}&page[number]=${page}`;
+ if (query) {
+ url += `&q=${encodeURIComponent(query)}`;
+ }
+
+ const res = await fetch(url);
const json = await res.json();
const results = json[entityConfigs[entity].plural || entity];
@@ -156,6 +171,22 @@ function generateEntitySearchParameters(entity) {
return parameters;
}
+function generateFilterAndSortParameters(filters, sortBy) {
+ const parameters = [];
+
+ for (const [ key, value ] of Object.entries(filters)) {
+ if (value) {
+ parameters.push(`filter[${key}]=${value}`);
+ }
+ }
+
+ if (sortBy) {
+ parameters.push(`sort=${sortBy}`);
+ }
+
+ return parameters;
+}
+
// Map artists and songs to performances to comply with the application schema
function applyThemeSchema(themes) {
for (const theme of themes) {
diff --git a/src/pages/design.js b/src/pages/design.js
index d7ff3df..1fcd120 100644
--- a/src/pages/design.js
+++ b/src/pages/design.js
@@ -53,6 +53,7 @@ export default function DesignPage() {
const colors = Object.keys(theme.colors);
const [selectedItem, setSelectedItem] = useState("anime");
+ const [season, setSeason] = useState(null);
const [, entitySwitcher] = useSwitcher([ "anime", "themes", "artists" ], "anime");
const [maxLines, toggleMaxLines] = useToggle(1, 0);
@@ -472,21 +473,37 @@ export default function DesignPage() {
{codeBlock`
-
+ // At the top of the component
+ const [season, setSeason] = useState(null);
+
+ // Inside the render output
+
`}
-
+
Utils
diff --git a/src/templates/search.js b/src/templates/search.js
index a97c0b6..cc30697 100644
--- a/src/templates/search.js
+++ b/src/templates/search.js
@@ -8,7 +8,7 @@ import { gapsColumn, gapsRow } from "styles/mixins";
import { Box, Flex } from "components/box";
import { Switcher } from "components/switcher";
import { SEO } from "components/seo";
-import { faTimes } from "@fortawesome/free-solid-svg-icons";
+import { faCompass, faSearch, faTimes } from "@fortawesome/free-solid-svg-icons";
import { Text } from "components/text";
import { Icon } from "components/icon";
@@ -24,7 +24,7 @@ const StyledSearchOptions = styled(Flex)`
}
`;
-export default function SearchPage({ pageContext: { entity }, location: { search, hash } }) {
+export default function SearchPage({ pageContext: { entity }, location: { search, hash, state } }) {
const urlParams = useMemo(() => new URLSearchParams(search), [ search ]);
const urlSuffix = search + hash;
@@ -64,9 +64,8 @@ export default function SearchPage({ pageContext: { entity }, location: { search
@@ -77,14 +76,14 @@ export default function SearchPage({ pageContext: { entity }, location: { search
>
{({ Button, item, selected, content }) => item.value === null ? (
!!entity ? (
-
+
) : null
) : (
-
+
@@ -92,42 +91,28 @@ export default function SearchPage({ pageContext: { entity }, location: { search
)}
- {/**/}
- {/* */}
- {/* */}
- {/* Season*/}
- {/* */}
- {/* */}
- {/* */}
- {/* Year*/}
- {/* {*/}
- {/* options[year] = year;*/}
- {/* return options;*/}
- {/* }, {})*/}
- {/* }/>*/}
- {/* */}
- {/* */}
- {/**/}
- {}
);
}
function Search({ searchQuery, searchEntity }) {
- if (searchQuery) {
- if (searchEntity) {
- return ;
- } else {
- return ;
- }
+ if (searchEntity) {
+ return ;
+ } else if (searchQuery) {
+ return ;
} else {
- return Type in a query to begin searching.;
+ return (
+
+
+
+ Looking for something specific? Use the search bar on the left!
+
+
+
+ Feeling adventurous? Explore the database by choosing a category on the right!
+
+
+ );
}
}
diff --git a/src/theme/index.js b/src/theme/index.js
index b93d50d..3a9d512 100644
--- a/src/theme/index.js
+++ b/src/theme/index.js
@@ -5,7 +5,8 @@ const theme = {
"721px"
],
shadows: {
- low: "0 3px 6px rgb(0 0 0 / .15), 0 2px 4px rgb(0 0 0 / .12)"
+ low: "0 3px 6px rgb(0 0 0 / .15), 0 2px 4px rgb(0 0 0 / .12)",
+ high: "0 3px 3px 5px rgb(0 0 0 / .15), 0 2px 9px 5px rgb(0 0 0 / .12)"
},
colors: createThemeDefinition()
};