diff --git a/packages/insomnia/src/common/constants.ts b/packages/insomnia/src/common/constants.ts index 306e053db57..0ff6e419968 100644 --- a/packages/insomnia/src/common/constants.ts +++ b/packages/insomnia/src/common/constants.ts @@ -348,6 +348,36 @@ export const sortOrderName: Record = { [SORT_TYPE_ASC]: 'Requests First', }; +export type CollectionSortOrder = + | 'name-asc' + | 'name-desc' + | 'created-asc' + | 'created-desc' + | 'http-method' + | 'type-desc' + | 'type-asc' + | 'type-manual'; +export const COLLECTION_SORT_ORDERS = [ + SORT_TYPE_MANUAL, + SORT_NAME_ASC, + SORT_NAME_DESC, + SORT_CREATED_ASC, + SORT_CREATED_DESC, + SORT_HTTP_METHOD, + SORT_TYPE_DESC, + SORT_TYPE_ASC, +] as const; +export const collectionSortOrderName: Record = { + [SORT_TYPE_MANUAL]: 'Manual', + [SORT_NAME_ASC]: 'Name Ascending (A-Z)', + [SORT_NAME_DESC]: 'Name Descending (Z-A)', + [SORT_CREATED_ASC]: 'Oldest First', + [SORT_CREATED_DESC]: 'Newest First', + [SORT_HTTP_METHOD]: 'HTTP Method', + [SORT_TYPE_DESC]: 'Folders First', + [SORT_TYPE_ASC]: 'Requests First', +}; + export type DashboardSortOrder = | 'name-asc' | 'name-desc' diff --git a/packages/insomnia/src/ui/routes/debug.tsx b/packages/insomnia/src/ui/routes/debug.tsx index 079f2bc0f55..52b81c1bd35 100644 --- a/packages/insomnia/src/ui/routes/debug.tsx +++ b/packages/insomnia/src/ui/routes/debug.tsx @@ -32,11 +32,13 @@ import { useRouteLoaderData, useSearchParams, } from 'react-router-dom'; +import { useLocalStorage } from 'react-use'; -import { DEFAULT_SIDEBAR_SIZE, SORT_ORDERS, SortOrder, sortOrderName } from '../../common/constants'; +import { DEFAULT_SIDEBAR_SIZE, CollectionSortOrder, collectionSortOrderName, SORT_NAME_ASC, SORT_ORDERS } from '../../common/constants'; import { ChangeBufferEvent, database as db } from '../../common/database'; import { generateId } from '../../common/misc'; import { PlatformKeyCombinations } from '../../common/settings'; +import { sortMethodMap } from '../../common/sorting'; import type { GrpcMethodInfo } from '../../main/ipc/grpc'; import * as models from '../../models'; import { Environment } from '../../models/environment'; @@ -435,7 +437,7 @@ export const Debug: FC = () => { const setActiveEnvironmentFetcher = useFetcher(); const [searchParams, setSearchParams] = useSearchParams(); - const sortOrder = searchParams.get('sortOrder') as SortOrder || 'type-manual'; + const [sortOrder, setSortOrder] = useLocalStorage(`${projectId}:collection-sort-order`, SORT_NAME_ASC); const { hotKeyRegistry } = settings; const createRequest = ({ requestType, parentId, req }: { requestType: CreateRequestType; parentId: string; req?: Partial }) => @@ -649,7 +651,7 @@ export const Debug: FC = () => { ...environment, })); - const visibleCollection = collection.filter(item => !item.hidden); + const visibleCollection = collection.filter(item => !item.hidden).sort((a, b) => sortMethodMap[sortOrder as CollectionSortOrder](a.doc, b.doc));; const parentRef = useRef(null); const virtualizer = useVirtualizer({ @@ -867,12 +869,7 @@ export const Debug: FC = () => { aria-label="Sort order" className="h-full aspect-square" selectedKey={sortOrder} - onSelectionChange={order => - setSearchParams({ - ...Object.fromEntries(searchParams.entries()), - sortOrder: order.toString(), - }) - } + onSelectionChange={order => setSortOrder(order as CollectionSortOrder)} >