diff --git a/web/src/components/MemoFilters.tsx b/web/src/components/MemoFilters.tsx
index 70fd6f39..639b43b1 100644
--- a/web/src/components/MemoFilters.tsx
+++ b/web/src/components/MemoFilters.tsx
@@ -40,6 +40,15 @@ const MemoFilters = () => {
))}
+
memoFilterStore.setOrderByTimeAsc(!memoFilterStore.orderByTimeAsc)}
+ >
+
+
+ {memoFilterStore.orderByTimeAsc ? "Asc" : "Desc"}
+
+
);
diff --git a/web/src/pages/Archived.tsx b/web/src/pages/Archived.tsx
index cc28c7b3..034de908 100644
--- a/web/src/pages/Archived.tsx
+++ b/web/src/pages/Archived.tsx
@@ -26,7 +26,11 @@ const Archived = () => {
const [nextPageToken, setNextPageToken] = useState("");
const sortedMemos = memoList.value
.filter((memo) => memo.rowStatus === RowStatus.ARCHIVED)
- .sort((a, b) => dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix());
+ .sort((a, b) =>
+ memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0
+ ? dayjs(a.displayTime).unix() - dayjs(b.displayTime).unix()
+ : dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix(),
+ );
useEffect(() => {
memoList.reset();
@@ -45,6 +49,9 @@ const Archived = () => {
tagSearch.push(`"${filter.value}"`);
}
}
+ if (memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0) {
+ filters.push(`order_by_time_asc == true`);
+ }
if (contentSearch.length > 0) {
filters.push(`content_search == [${contentSearch.join(", ")}]`);
}
diff --git a/web/src/pages/Explore.tsx b/web/src/pages/Explore.tsx
index 5863577b..20cc9f80 100644
--- a/web/src/pages/Explore.tsx
+++ b/web/src/pages/Explore.tsx
@@ -23,7 +23,11 @@ const Explore = () => {
const memoFilterStore = useMemoFilterStore();
const [isRequesting, setIsRequesting] = useState(true);
const [nextPageToken, setNextPageToken] = useState("");
- const sortedMemos = memoList.value.sort((a, b) => dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix());
+ const sortedMemos = memoList.value.sort((a, b) =>
+ memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0
+ ? dayjs(a.displayTime).unix() - dayjs(b.displayTime).unix()
+ : dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix(),
+ );
useEffect(() => {
memoList.reset();
@@ -42,6 +46,9 @@ const Explore = () => {
tagSearch.push(`"${filter.value}"`);
}
}
+ if (memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0) {
+ filters.push(`order_by_time_asc == true`);
+ }
if (contentSearch.length > 0) {
filters.push(`content_search == [${contentSearch.join(", ")}]`);
}
diff --git a/web/src/pages/Home.tsx b/web/src/pages/Home.tsx
index a6aca6a8..7bb494e2 100644
--- a/web/src/pages/Home.tsx
+++ b/web/src/pages/Home.tsx
@@ -27,7 +27,11 @@ const Home = () => {
const [nextPageToken, setNextPageToken] = useState("");
const sortedMemos = memoList.value
.filter((memo) => memo.rowStatus === RowStatus.ACTIVE)
- .sort((a, b) => dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix())
+ .sort((a, b) =>
+ memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0
+ ? dayjs(a.displayTime).unix() - dayjs(b.displayTime).unix()
+ : dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix(),
+ )
.sort((a, b) => Number(b.pinned) - Number(a.pinned));
useEffect(() => {
@@ -57,6 +61,9 @@ const Home = () => {
filters.push(`display_time_before == ${timestampAfter + 60 * 60 * 24}`);
}
}
+ if (memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0) {
+ filters.push(`order_by_time_asc == true`);
+ }
if (contentSearch.length > 0) {
filters.push(`content_search == [${contentSearch.join(", ")}]`);
}
diff --git a/web/src/pages/UserProfile.tsx b/web/src/pages/UserProfile.tsx
index 7b698fd3..4649388e 100644
--- a/web/src/pages/UserProfile.tsx
+++ b/web/src/pages/UserProfile.tsx
@@ -28,7 +28,11 @@ const UserProfile = () => {
const [isRequesting, setIsRequesting] = useState(true);
const [nextPageToken, setNextPageToken] = useState("");
const sortedMemos = memoList.value
- .sort((a, b) => dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix())
+ .sort((a, b) =>
+ memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0
+ ? dayjs(a.displayTime).unix() - dayjs(b.displayTime).unix()
+ : dayjs(b.displayTime).unix() - dayjs(a.displayTime).unix(),
+ )
.sort((a, b) => Number(b.pinned) - Number(a.pinned));
useEffect(() => {
@@ -78,6 +82,9 @@ const UserProfile = () => {
tagSearch.push(`"${filter.value}"`);
}
}
+ if (memoFilterStore.orderByTimeAsc && memoFilterStore.filters.length > 0) {
+ filters.push(`order_by_time_asc == true`);
+ }
if (contentSearch.length > 0) {
filters.push(`content_search == [${contentSearch.join(", ")}]`);
}
diff --git a/web/src/store/v1/memoFilter.ts b/web/src/store/v1/memoFilter.ts
index dbf30705..b3183969 100644
--- a/web/src/store/v1/memoFilter.ts
+++ b/web/src/store/v1/memoFilter.ts
@@ -20,14 +20,16 @@ export const getMemoFilterKey = (filter: MemoFilter) => `${filter.factor}:${filt
interface State {
filters: MemoFilter[];
+ orderByTimeAsc: boolean;
}
export const useMemoFilterStore = create(
- combine(((): State => ({ filters: [] }))(), (set, get) => ({
+ combine(((): State => ({ filters: [], orderByTimeAsc: false }))(), (set, get) => ({
setState: (state: State) => set(state),
getState: () => get(),
getFiltersByFactor: (factor: FilterFactor) => get().filters.filter((f) => f.factor === factor),
addFilter: (filter: MemoFilter) => set((state) => ({ filters: uniqBy([...state.filters, filter], getMemoFilterKey) })),
removeFilter: (filterFn: (f: MemoFilter) => boolean) => set((state) => ({ filters: state.filters.filter((f) => !filterFn(f)) })),
+ setOrderByTimeAsc: (orderByTimeAsc: boolean) => set({ orderByTimeAsc }),
})),
);