diff --git a/web/src/pages/Browse.tsx b/web/src/pages/Browse.tsx index c8edcc1a..aa2c2246 100644 --- a/web/src/pages/Browse.tsx +++ b/web/src/pages/Browse.tsx @@ -1,22 +1,21 @@ -import { useState, useRef } from 'react'; +import { useRef, useState } from 'react'; import Nav from 'react-bootstrap/Nav'; import { NavLink, useParams, useSearchParams } from 'react-router-dom'; +import { NamespaceGrid } from '../components/browse/namespace-grid'; +import { NamespaceLongRow } from '../components/browse/namespace-long-row'; +import { ProjectAccordion } from '../components/browse/project-accordion'; import { PageLayout } from '../components/layout/page-layout'; +import { Markdown } from '../components/markdown/render'; import { CreateSchemaModal } from '../components/modals/create-schema-modal'; import { SchemasPagePlaceholder } from '../components/schemas/placeholders/schemas-page-placeholder'; import { SchemaCard } from '../components/schemas/schema-card'; import { SchemasNav } from '../components/schemas/schemas-nav'; +import { LoadingSpinner } from '../components/spinners/loading-spinner'; import { useAllSchemas } from '../hooks/queries/useAllSchemas'; -import { useDebounce } from '../hooks/useDebounce'; import { useBiggestNamespace } from '../hooks/queries/useBiggestNamespace'; import { useNamespaceProjects } from '../hooks/queries/useNamespaceProjects'; -import { LoadingSpinner } from '../components/spinners/loading-spinner'; -import { Markdown } from '../components/markdown/render'; -import { ProjectAccordion } from '../components/browse/project-accordion' -import { NamespaceLongRow } from '../components/browse/namespace-long-row' -import { NamespaceGrid } from '../components/browse/namespace-grid' - +import { useDebounce } from '../hooks/useDebounce'; type View = 'peps' | 'schemas'; @@ -55,17 +54,16 @@ export function Browse() { limit: 10, offset: 0, orderBy: 'stars', - // orderBy: 'update_date', - order: 'desc', + order: 'asc', search: '', type: 'pep', }); - + const handleSelectNamespace = (selectedNamespace: string) => { - setSelectedNamespace((prevSelectedNamespace: string | undefined) => - prevSelectedNamespace === selectedNamespace ? undefined : selectedNamespace + setSelectedNamespace((prevSelectedNamespace: string | undefined) => + prevSelectedNamespace === selectedNamespace ? undefined : selectedNamespace, ); - } + }; const handleNavSelect = (eventKey: string | null) => { if (eventKey === null) { @@ -115,17 +113,16 @@ export function Browse() { ); } - return (
-
- {view === 'peps' ? + {view === 'peps' ? ( <> -
- {selectedNamespace === undefined ? -
+
+ {selectedNamespace === undefined ? ( +
- : -
+ ) : ( +
- } + )}
-
-
- {topNamespace?.data?.results ? +
+
+ {topNamespace?.data?.results ? ( <> -
-
- Top 10 Starred PEPs -
+ -

Want to see more? Visit the namespace to view remaining projects.

+

+ Want to see more? Visit the namespace to view remaining projects. +

- : selectedNamespace ? -
- -
- : null - } + ) : selectedNamespace ? ( +
+ +
+ ) : null}
- : + ) : (
- } - + )}