Add user pages

client/App.tsx

@@ -11,6 +11,7 @@ import { LoginPage } from './pages/LoginPage'
 import { ProblemPage } from './pages/ProblemPage'
 import { ProfilePage } from './pages/ProfilePage'
 import { ScoresPage } from './pages/ScoresPage'
+import { UserPage } from './pages/UserPage'
 
 const Redirect = ({ to }: { to: string }) => {
     useEffect(() => {
@@ -47,6 +48,10 @@ export const App = ({ url }: { url?: string }) => {
                     // @ts-ignore
                     path={pbu('/problem/:id')}
                 />
+                <UserPage
+                    // @ts-ignore
+                    path={pbu('/u/:uid')}
+                />
                 <AdminPage
                     // @ts-ignore
                     path={pbu('/admin')}

client/components/Solution.tsx

@@ -93,7 +93,7 @@ export const Solution = ({
                     {sentBy && (
                         <>
                             {' '}
-                            di <a href={prependBaseUrl(`/user/${sentBy}`)}>@{sentBy}</a>
+                            di <a href={prependBaseUrl(`/u/${sentBy}`)}>@{sentBy}</a>
                         </>
                     )}
                     {forProblem && (

client/pages/UserPage.tsx

@@ -0,0 +1,33 @@
+import { isAdministrator, Solution as SolutionModel } from '../../shared/model'
+import { sortByStringKey } from '../../shared/utils'
+import { prependBaseUrl } from '../api'
+import { Header } from '../components/Header'
+import { Solution } from '../components/Solution'
+import { useResource } from '../hooks'
+import { useCurrentUser } from '../hooks/useCurrentUser'
+
+type RouteProps = {
+    uid: string
+}
+
+export const UserPage = ({ uid }: RouteProps) => {
+
+    const [user] = useCurrentUser()
+
+    const [solutions, refreshSolutions] = useResource<SolutionModel[]>(`/api/solutions?user=${uid}`, [])
+    const sortedSolutions = sortByStringKey(solutions, s => s.createdAt, false)
+
+    return (
+        <>
+            <Header />
+            <main class="page-profile">
+                <div class="subtitle">Soluzioni di <a href={prependBaseUrl(`/u/${uid}`)}>@{uid}</a></div>
+                <div class="solution-list">
+                    {sortedSolutions.map(solution => (
+                        <Solution refreshSolution={refreshSolutions} {...solution} adminControls={user !== null && isAdministrator(user.role)} />
+                    ))}
+                </div>
+            </main>
+        </>
+    )
+}