({
)}
- {(pages[page]?.length ?? 0) > 0 ? (
- pages[page]?.map(
+ {(pages[page - 1]?.length ?? 0) > 0 ? (
+ pages[page - 1]?.map(
(group) =>
group.items.length > 0 && (
diff --git a/src/contexts/appLayout.ts b/src/contexts/appLayout.ts
index 506ccdf..0cbc3dd 100644
--- a/src/contexts/appLayout.ts
+++ b/src/contexts/appLayout.ts
@@ -7,6 +7,7 @@ import { atoms } from "contexts/atoms";
export const useAppLayout = (): void => {
const router = useRouter();
+ const setSearchOpened = useAtomSetter(atoms.layout.searchOpened);
const setSettingsOpened = useAtomSetter(atoms.layout.settingsOpened);
const setMainPanelOpened = useAtomSetter(atoms.layout.mainPanelOpened);
const setSubPanelOpened = useAtomSetter(atoms.layout.subPanelOpened);
@@ -14,6 +15,7 @@ export const useAppLayout = (): void => {
useEffect(() => {
router.events.on("routeChangeStart", () => {
console.log("[Router Events] on routeChangeStart");
+ setSearchOpened(false);
setSettingsOpened(false);
setMainPanelOpened(false);
setSubPanelOpened(false);
@@ -23,7 +25,7 @@ export const useAppLayout = (): void => {
console.log("[Router Events] on hashChangeStart");
setSubPanelOpened(false);
});
- }, [router, setSettingsOpened, setMainPanelOpened, setSubPanelOpened]);
+ }, [router, setSettingsOpened, setMainPanelOpened, setSubPanelOpened, setSearchOpened]);
useScrollIntoView();
};
diff --git a/src/contexts/atoms.ts b/src/contexts/atoms.ts
index 8c2d790..1151ae0 100644
--- a/src/contexts/atoms.ts
+++ b/src/contexts/atoms.ts
@@ -14,13 +14,15 @@ import { lightBox } from "contexts/LightBoxProvider";
/* [ APPLAYOUT ATOMS ] */
const mainPanelReduced = atomPairing(atomWithStorage("isMainPanelReduced", false));
-const settingsOpened = atomPairing(atomWithStorage("isSettingsOpened", false));
-const subPanelOpened = atomPairing(atomWithStorage("isSubPanelOpened", false));
-const mainPanelOpened = atomPairing(atomWithStorage("isMainPanelOpened", false));
+const searchOpened = atomPairing(atom(false));
+const settingsOpened = atomPairing(atom(false));
+const subPanelOpened = atomPairing(atom(false));
+const mainPanelOpened = atomPairing(atom(false));
const menuGesturesEnabled = atomPairing(atomWithStorage("isMenuGesturesEnabled", false));
const terminalMode = atom((get) => get(settings.playerName[0]) === "root");
const layout = {
+ searchOpened,
mainPanelReduced,
settingsOpened,
subPanelOpened,
diff --git a/src/graphql/operations/getContents.graphql b/src/graphql/operations/getContents.graphql
index 601f0dd..2dab8df 100644
--- a/src/graphql/operations/getContents.graphql
+++ b/src/graphql/operations/getContents.graphql
@@ -35,33 +35,6 @@ query getContents($language_code: String) {
}
}
}
- ranged_contents(pagination: { limit: -1 }) {
- data {
- id
- attributes {
- slug
- scan_set {
- id
- }
- library_item {
- data {
- attributes {
- slug
- title
- subtitle
- thumbnail {
- data {
- attributes {
- ...uploadImage
- }
- }
- }
- }
- }
- }
- }
- }
- }
thumbnail {
data {
attributes {
diff --git a/src/graphql/operations/getVideoChannel.graphql b/src/graphql/operations/getVideoChannel.graphql
index 20fb705..b12e499 100644
--- a/src/graphql/operations/getVideoChannel.graphql
+++ b/src/graphql/operations/getVideoChannel.graphql
@@ -5,29 +5,6 @@ query getVideoChannel($channel: String) {
uid
title
subscribers
- videos(pagination: { limit: -1 }) {
- data {
- id
- attributes {
- uid
- title
- views
- duration
- gone
- categories(pagination: { limit: -1 }) {
- data {
- id
- attributes {
- short
- }
- }
- }
- published_date {
- ...datePicker
- }
- }
- }
- }
}
}
}
diff --git a/src/graphql/operations/local-data/localDataGetWebsiteInterfaces.graphql b/src/graphql/operations/local-data/localDataGetWebsiteInterfaces.graphql
index 425f97f..77f66cd 100644
--- a/src/graphql/operations/local-data/localDataGetWebsiteInterfaces.graphql
+++ b/src/graphql/operations/local-data/localDataGetWebsiteInterfaces.graphql
@@ -191,6 +191,14 @@ query localDataGetWebsiteInterfaces {
reset_all_options
reading_layout
quality
+ only_unavailable_videos
+ oldest
+ newest
+ least_popular
+ most_popular
+ shortest
+ longest
+ search
}
}
}
diff --git a/src/helpers/analytics.ts b/src/helpers/analytics.ts
index c12a1f7..59c7e9a 100644
--- a/src/helpers/analytics.ts
+++ b/src/helpers/analytics.ts
@@ -1,6 +1,8 @@
export const sendAnalytics = (category: string, event: string): void => {
+ const eventName = `[${category}] ${event}`;
+ console.log(`Event: ${eventName}`);
try {
- umami(`[${category}] ${event}`);
+ umami(eventName);
} catch (error) {
if (error instanceof ReferenceError) return;
console.log(error);
diff --git a/src/helpers/date.ts b/src/helpers/date.ts
index 08f1396..86fb574 100644
--- a/src/helpers/date.ts
+++ b/src/helpers/date.ts
@@ -1,5 +1,10 @@
-import { isUndefined } from "./asserts";
-import { DatePickerFragment } from "graphql/generated";
+import { isDefined, isUndefined } from "./asserts";
+
+type DatePickerFragment = {
+ year?: number | null;
+ month?: number | null;
+ day?: number | null;
+};
export const compareDate = (
a: DatePickerFragment | null | undefined,
@@ -8,10 +13,11 @@ export const compareDate = (
if (isUndefined(a) || isUndefined(b)) {
return 0;
}
- const dateA = (a.year ?? Infinity) * 365 + (a.month ?? 12) * 31 + (a.day ?? 31);
- const dateB = (b.year ?? Infinity) * 365 + (b.month ?? 12) * 31 + (b.day ?? 31);
- return dateA - dateB;
+ return dateInDays(a) - dateInDays(b);
};
+const dateInDays = (date: DatePickerFragment | null | undefined): number =>
+ isDefined(date) ? (date.year ?? Infinity) * 365 + (date.month ?? 12) * 31 + (date.day ?? 31) : 0;
+
export const datePickerToDate = (date: DatePickerFragment): Date =>
new Date(date.year ?? 0, date.month ? date.month - 1 : 0, date.day ?? 1);
diff --git a/src/helpers/formatters.ts b/src/helpers/formatters.ts
index 82cf34b..123139f 100644
--- a/src/helpers/formatters.ts
+++ b/src/helpers/formatters.ts
@@ -208,12 +208,12 @@ export const prettyItemSubType = (
/* eslint-enable id-denylist */
export const prettyShortenNumber = (number: number): string => {
- if (number > 1000000) {
- return number.toLocaleString(undefined, {
+ if (number > 1_000_000) {
+ return `${(number / 1_000_000).toLocaleString(undefined, {
maximumSignificantDigits: 3,
- });
- } else if (number > 1000) {
- return `${(number / 1000).toLocaleString(undefined, {
+ })}M`;
+ } else if (number > 1_000) {
+ return `${(number / 1_000).toLocaleString(undefined, {
maximumSignificantDigits: 2,
})}K`;
}
diff --git a/src/helpers/search.ts b/src/helpers/search.ts
new file mode 100644
index 0000000..058117a
--- /dev/null
+++ b/src/helpers/search.ts
@@ -0,0 +1,48 @@
+/* eslint-disable @typescript-eslint/no-explicit-any */
+// eslint-disable-next-line import/named
+import { MatchesPosition, MeiliSearch, SearchParams, SearchResponse } from "meilisearch";
+import { isDefined } from "./asserts";
+import { MeiliDocumentsType } from "shared/meilisearch-graphql-typings/meiliTypes";
+
+const meili = new MeiliSearch({
+ host: process.env.NEXT_PUBLIC_URL_MEILISEARCH ?? "",
+ apiKey: process.env.NEXT_PUBLIC_MEILISEARCH_KEY,
+});
+
+interface CustomSearchParams
+ extends Omit<
+ SearchParams,
+ "cropMarker" | "highlightPostTag" | "highlightPreTag" | "q" | "showMatchesPosition"
+ > {}
+
+type CustomHit> = T & {
+ _formatted: Partial;
+ _matchesPosition: MatchesPosition;
+};
+
+type CustomHits> = CustomHit[];
+
+export interface CustomSearchResponse extends Omit, "hits"> {
+ hits: CustomHits;
+}
+
+// eslint-disable-next-line @typescript-eslint/explicit-module-boundary-types
+export const meiliSearch = async (
+ indexName: I,
+ query: string,
+ options: CustomSearchParams
+) => {
+ const index = meili.index(indexName);
+ return (await index.search["documents"]>(query, {
+ ...options,
+ attributesToHighlight: options.attributesToHighlight ?? ["*"],
+ highlightPreTag: "",
+ highlightPostTag: "",
+ showMatchesPosition: true,
+ cropLength: 20,
+ cropMarker: "...",
+ })) as unknown as CustomSearchResponse["documents"]>;
+};
+
+export const containsHighlight = (text: string | null | undefined): boolean =>
+ isDefined(text) && text.includes("");
diff --git a/src/hooks/useTypedRouter.ts b/src/hooks/useTypedRouter.ts
new file mode 100644
index 0000000..6c80445
--- /dev/null
+++ b/src/hooks/useTypedRouter.ts
@@ -0,0 +1,36 @@
+import { NextRouter, useRouter } from "next/router";
+import { useCallback } from "react";
+import { z } from "zod";
+
+interface TypeRouter extends Omit {
+ query: z.TypeOf;
+ updateQuery: (queryParams: z.TypeOf) => void;
+}
+
+export const useTypedRouter = (schema: T): TypeRouter => {
+ const { query, ...router } = useRouter();
+
+ const updateQuery = useCallback(
+ async (queryParams: z.TypeOf) => {
+ Object.keys(queryParams).map((key: keyof typeof queryParams) => {
+ if (typeof queryParams[key] === "boolean") {
+ queryParams[key] = queryParams[key] ? "true" : undefined;
+ }
+ });
+ await router.replace(
+ { pathname: router.pathname, query: { ...query, ...queryParams } },
+ undefined,
+ {
+ shallow: true,
+ }
+ );
+ },
+ [router, query]
+ );
+
+ return {
+ query: schema.parse(query) as z.infer,
+ updateQuery,
+ ...router,
+ };
+};
diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx
index e0af11c..b5fe73f 100644
--- a/src/pages/_app.tsx
+++ b/src/pages/_app.tsx
@@ -23,6 +23,7 @@ import { SettingsPopup } from "components/Panels/SettingsPopup";
import { useSettings } from "contexts/settings";
import { useContainerQueries } from "contexts/containerQueries";
import { useWebkitFixes } from "contexts/webkitFixes";
+import { SearchPopup } from "components/Panels/SearchPopup";
const AccordsLibraryApp = (props: AppProps): JSX.Element => {
useLocalData();
@@ -33,6 +34,7 @@ const AccordsLibraryApp = (props: AppProps): JSX.Element => {
return (
<>
+