algorithm/tech-interview-handbook
1
0
Fork 0
mirror of https://github.com/yangshun/tech-interview-handbook.git synced 2025-07-28 04:33:42 +08:00
Code Issues Packages Projects Releases Wiki Activity

[resumes][fix] browse ui and sort order labels

Browse Source
This commit is contained in:
Wu Peirong
2022-10-25 18:46:17 +08:00
parent 199fc1a8b9
commit 05119f52fa
3 changed files with 26 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
apps/portal/src/pages/resumes/[resumeId].tsx
View File

@ -31,7 +31,6 @@ import {
INITIAL_FILTER_STATE, INITIAL_FILTER_STATE,
LOCATIONS, LOCATIONS,
ROLES, ROLES,
SORT_OPTIONS,
} from '~/utils/resumes/resumeFilters'; } from '~/utils/resumes/resumeFilters';
import { trpc } from '~/utils/trpc'; import { trpc } from '~/utils/trpc';
@ -118,7 +117,7 @@ export default function ResumeReviewPage() {
currentPage: JSON.stringify(1), currentPage: JSON.stringify(1),
searchValue: JSON.stringify(''), searchValue: JSON.stringify(''),
shortcutSelected: JSON.stringify('all'), shortcutSelected: JSON.stringify('all'),
sortOrder: JSON.stringify(SORT_OPTIONS.LATEST), sortOrder: JSON.stringify('latest'),
tabsValue: JSON.stringify(BROWSE_TABS_VALUES.ALL), tabsValue: JSON.stringify(BROWSE_TABS_VALUES.ALL),
userFilters: JSON.stringify({ userFilters: JSON.stringify({
...INITIAL_FILTER_STATE, ...INITIAL_FILTER_STATE,

23
apps/portal/src/pages/resumes/browse.tsx
View File

@ -38,7 +38,7 @@ import useDebounceValue from '~/utils/resumes/useDebounceValue';
import useSearchParams from '~/utils/resumes/useSearchParams'; import useSearchParams from '~/utils/resumes/useSearchParams';
import { trpc } from '~/utils/trpc'; import { trpc } from '~/utils/trpc';
import type { FilterState } from '../../utils/resumes/resumeFilters'; import type { FilterState, SortOrder } from '../../utils/resumes/resumeFilters';
const STALE_TIME = 5 * 60 * 1000; const STALE_TIME = 5 * 60 * 1000;
const DEBOUNCE_DELAY = 800; const DEBOUNCE_DELAY = 800;
@ -102,9 +102,9 @@ export default function ResumeHomePage() {
'tabsValue', 'tabsValue',
BROWSE_TABS_VALUES.ALL, BROWSE_TABS_VALUES.ALL,
); );
const [sortOrder, setSortOrder, isSortOrderInit] = useSearchParams( const [sortOrder, setSortOrder, isSortOrderInit] = useSearchParams<SortOrder>(
'sortOrder', 'sortOrder',
SORT_OPTIONS.LATEST, 'latest',
); );
const [searchValue, setSearchValue, isSearchValueInit] = useSearchParams( const [searchValue, setSearchValue, isSearchValueInit] = useSearchParams(
'searchValue', 'searchValue',
@ -491,7 +491,7 @@ export default function ResumeHomePage() {
{filter.options.map((option) => ( {filter.options.map((option) => (
<div <div
key={option.value} key={option.value}
className="[&>div>div:nth-child(1)>input]:text-primary-600 [&>div>div:nth-child(1)>input]:ring-primary-500 [&>div>div:nth-child(2)>label]:font-normal"> className="[&>div>div:nth-child(1)>input]:text-primary-600 [&>div>div:nth-child(1)>input]:ring-primary-500 px-1 [&>div>div:nth-child(2)>label]:font-normal">
<CheckboxInput <CheckboxInput
label={option.label} label={option.label}
value={userFilters[filter.id].includes( value={userFilters[filter.id].includes(
@ -563,12 +563,17 @@ export default function ResumeHomePage() {
/> />
</div> </div>
<div> <div>
<DropdownMenu align="end" label={SORT_OPTIONS[sortOrder]}> <DropdownMenu
{Object.entries(SORT_OPTIONS).map(([key, value]) => ( align="end"
label={
SORT_OPTIONS.find(({ value }) => value === sortOrder)
?.label
}>
{SORT_OPTIONS.map(({ label, value }) => (
<DropdownMenu.Item <DropdownMenu.Item
key={key} key={value}
isSelected={sortOrder === key} isSelected={sortOrder === value}
label={value} label={label}
onClick={() => setSortOrder(value)}></DropdownMenu.Item> onClick={() => setSortOrder(value)}></DropdownMenu.Item>
))} ))}
</DropdownMenu> </DropdownMenu>

16
apps/portal/src/utils/resumes/resumeFilters.ts
View File

@ -54,11 +54,17 @@ export const BROWSE_TABS_VALUES = {
STARRED: 'starred', STARRED: 'starred',
}; };
export const SORT_OPTIONS: Record<string, SortOrder> = { // Export const SORT_OPTIONS: Record<string, SortOrder> = {
LATEST: 'latest', // LATEST: 'latest',
POPULAR: 'popular', // POPULAR: 'popular',
TOPCOMMENTS: 'topComments', // TOPCOMMENTS: 'topComments',
}; // };
export const SORT_OPTIONS: Array<FilterOption<SortOrder>> = [
{ label: 'Latest', value: 'latest' },
{ label: 'Popular', value: 'popular' },
{ label: 'Top Comments', value: 'topComments' },
];
export const ROLES: Array<FilterOption<RoleFilter>> = [ export const ROLES: Array<FilterOption<RoleFilter>> = [
{ {