Compare commits
No commits in common. "354c577f7db7e6f82e2478aeb46b1e90bae74efa" and "3aafab36c266b22272981de050d37b58e80ec240" have entirely different histories.
354c577f7d
...
3aafab36c2
9 changed files with 38 additions and 333 deletions
|
|
@ -116,9 +116,9 @@ type PostAuthSignInResponseObject interface {
|
||||||
}
|
}
|
||||||
|
|
||||||
type PostAuthSignIn200JSONResponse struct {
|
type PostAuthSignIn200JSONResponse struct {
|
||||||
Error *string `json:"error"`
|
Error *string `json:"error"`
|
||||||
UserId *string `json:"user_id"`
|
Success *bool `json:"success,omitempty"`
|
||||||
UserName *string `json:"user_name"`
|
UserId *string `json:"user_id"`
|
||||||
}
|
}
|
||||||
|
|
||||||
func (response PostAuthSignIn200JSONResponse) VisitPostAuthSignInResponse(w http.ResponseWriter) error {
|
func (response PostAuthSignIn200JSONResponse) VisitPostAuthSignInResponse(w http.ResponseWriter) error {
|
||||||
|
|
|
||||||
|
|
@ -59,23 +59,29 @@ paths:
|
||||||
type: string
|
type: string
|
||||||
format: password
|
format: password
|
||||||
responses:
|
responses:
|
||||||
# This one also sets two cookies: access_token and refresh_token
|
|
||||||
"200":
|
"200":
|
||||||
description: Sign-in result with JWT
|
description: Sign-in result with JWT
|
||||||
|
# headers:
|
||||||
|
# Set-Cookie:
|
||||||
|
# schema:
|
||||||
|
# type: array
|
||||||
|
# items:
|
||||||
|
# type: string
|
||||||
|
# explode: true
|
||||||
|
# style: simple
|
||||||
content:
|
content:
|
||||||
application/json:
|
application/json:
|
||||||
schema:
|
schema:
|
||||||
type: object
|
type: object
|
||||||
properties:
|
properties:
|
||||||
|
success:
|
||||||
|
type: boolean
|
||||||
error:
|
error:
|
||||||
type: string
|
type: string
|
||||||
nullable: true
|
nullable: true
|
||||||
user_id:
|
user_id:
|
||||||
type: string
|
type: string
|
||||||
nullable: true
|
nullable: true
|
||||||
user_name:
|
|
||||||
type: string
|
|
||||||
nullable: true
|
|
||||||
"401":
|
"401":
|
||||||
description: Access denied due to invalid credentials
|
description: Access denied due to invalid credentials
|
||||||
content:
|
content:
|
||||||
|
|
|
||||||
|
|
@ -78,6 +78,7 @@ func (s Server) PostAuthSignIn(ctx context.Context, req auth.PostAuthSignInReque
|
||||||
}
|
}
|
||||||
|
|
||||||
err := ""
|
err := ""
|
||||||
|
success := true
|
||||||
|
|
||||||
pass, ok := UserDb[req.Body.Nickname]
|
pass, ok := UserDb[req.Body.Nickname]
|
||||||
if !ok || pass != req.Body.Pass {
|
if !ok || pass != req.Body.Pass {
|
||||||
|
|
@ -95,9 +96,9 @@ func (s Server) PostAuthSignIn(ctx context.Context, req auth.PostAuthSignInReque
|
||||||
|
|
||||||
// Return access token; refresh token can be returned in response or HttpOnly cookie
|
// Return access token; refresh token can be returned in response or HttpOnly cookie
|
||||||
result := auth.PostAuthSignIn200JSONResponse{
|
result := auth.PostAuthSignIn200JSONResponse{
|
||||||
Error: &err,
|
Error: &err,
|
||||||
UserId: &req.Body.Nickname,
|
Success: &success,
|
||||||
UserName: &req.Body.Nickname,
|
UserId: &req.Body.Nickname,
|
||||||
}
|
}
|
||||||
return result, nil
|
return result, nil
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,34 +1,23 @@
|
||||||
import React from "react";
|
import React from "react";
|
||||||
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
|
import { BrowserRouter as Router, Routes, Route } from "react-router-dom";
|
||||||
import UsersIdPage from "./pages/UsersIdPage/UsersIdPage";
|
import UserPage from "./pages/UserPage/UserPage";
|
||||||
import TitlesPage from "./pages/TitlesPage/TitlesPage";
|
import TitlesPage from "./pages/TitlesPage/TitlesPage";
|
||||||
import { LoginPage } from "./pages/LoginPage/LoginPage";
|
import { LoginPage } from "./pages/LoginPage/LoginPage";
|
||||||
import { Header } from "./components/Header/Header";
|
import { Header } from "./components/Header/Header";
|
||||||
|
|
||||||
const App: React.FC = () => {
|
const App: React.FC = () => {
|
||||||
// Получаем username из localStorage
|
const username = "nihonium";
|
||||||
const username = localStorage.getItem("username") || undefined;
|
|
||||||
const userId = localStorage.getItem("userId");
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Router>
|
<Router>
|
||||||
<Header username={username} />
|
<Header username={username} />
|
||||||
<Routes>
|
<Routes>
|
||||||
<Route path="/login" element={<LoginPage />} />
|
<Route path="/login" element={<LoginPage />} /> {/* <-- маршрут для логина */}
|
||||||
<Route path="/signup" element={<LoginPage />} />
|
<Route path="/signup" element={<LoginPage />} /> {/* <-- можно использовать тот же компонент для регистрации */}
|
||||||
|
<Route path="/users/:id" element={<UserPage />} />
|
||||||
{/* /profile рендерит UsersIdPage с id из localStorage */}
|
|
||||||
<Route
|
|
||||||
path="/profile"
|
|
||||||
element={userId ? <UsersIdPage userId={userId} /> : <LoginPage />}
|
|
||||||
/>
|
|
||||||
|
|
||||||
<Route path="/users/:id" element={<UsersIdPage />} />
|
|
||||||
<Route path="/titles" element={<TitlesPage />} />
|
<Route path="/titles" element={<TitlesPage />} />
|
||||||
</Routes>
|
</Routes>
|
||||||
</Router>
|
</Router>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|
||||||
export default App;
|
export default App;
|
||||||
|
|
@ -20,7 +20,7 @@ export type OpenAPIConfig = {
|
||||||
};
|
};
|
||||||
|
|
||||||
export const OpenAPI: OpenAPIConfig = {
|
export const OpenAPI: OpenAPIConfig = {
|
||||||
BASE: '/api/v1',
|
BASE: 'http://10.1.0.65:8081/api/v1',
|
||||||
VERSION: '1.0.0',
|
VERSION: '1.0.0',
|
||||||
WITH_CREDENTIALS: false,
|
WITH_CREDENTIALS: false,
|
||||||
CREDENTIALS: 'include',
|
CREDENTIALS: 'include',
|
||||||
|
|
|
||||||
|
|
@ -20,7 +20,7 @@ export class DefaultService {
|
||||||
* @param sort
|
* @param sort
|
||||||
* @param sortForward
|
* @param sortForward
|
||||||
* @param word
|
* @param word
|
||||||
* @param status List of title statuses to filter
|
* @param status
|
||||||
* @param rating
|
* @param rating
|
||||||
* @param releaseYear
|
* @param releaseYear
|
||||||
* @param releaseSeason
|
* @param releaseSeason
|
||||||
|
|
@ -35,7 +35,7 @@ export class DefaultService {
|
||||||
sort?: TitleSort,
|
sort?: TitleSort,
|
||||||
sortForward: boolean = true,
|
sortForward: boolean = true,
|
||||||
word?: string,
|
word?: string,
|
||||||
status?: Array<TitleStatus>,
|
status?: TitleStatus,
|
||||||
rating?: number,
|
rating?: number,
|
||||||
releaseYear?: number,
|
releaseYear?: number,
|
||||||
releaseSeason?: ReleaseSeason,
|
releaseSeason?: ReleaseSeason,
|
||||||
|
|
@ -125,112 +125,45 @@ export class DefaultService {
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
/**
|
|
||||||
* Partially update a user account
|
|
||||||
* Update selected user profile fields (excluding password).
|
|
||||||
* Password updates must be done via the dedicated auth-service (`/auth/`).
|
|
||||||
* Fields not provided in the request body remain unchanged.
|
|
||||||
*
|
|
||||||
* @param userId User ID (primary key)
|
|
||||||
* @param requestBody
|
|
||||||
* @returns User User updated successfully. Returns updated user representation (excluding sensitive fields).
|
|
||||||
* @throws ApiError
|
|
||||||
*/
|
|
||||||
public static updateUser(
|
|
||||||
userId: number,
|
|
||||||
requestBody: {
|
|
||||||
/**
|
|
||||||
* ID of the user avatar (references `images.id`); set to `null` to remove avatar
|
|
||||||
*/
|
|
||||||
avatar_id?: number | null;
|
|
||||||
/**
|
|
||||||
* User email (must be unique and valid)
|
|
||||||
*/
|
|
||||||
mail?: string;
|
|
||||||
/**
|
|
||||||
* Username (alphanumeric + `_` or `-`, 3–16 chars)
|
|
||||||
*/
|
|
||||||
nickname?: string;
|
|
||||||
/**
|
|
||||||
* Display name
|
|
||||||
*/
|
|
||||||
disp_name?: string;
|
|
||||||
/**
|
|
||||||
* User description / bio
|
|
||||||
*/
|
|
||||||
user_desc?: string;
|
|
||||||
},
|
|
||||||
): CancelablePromise<User> {
|
|
||||||
return __request(OpenAPI, {
|
|
||||||
method: 'PATCH',
|
|
||||||
url: '/users/{user_id}',
|
|
||||||
path: {
|
|
||||||
'user_id': userId,
|
|
||||||
},
|
|
||||||
body: requestBody,
|
|
||||||
mediaType: 'application/json',
|
|
||||||
errors: {
|
|
||||||
400: `Invalid input (e.g., validation failed, nickname/email conflict, malformed JSON)`,
|
|
||||||
401: `Unauthorized — missing or invalid authentication token`,
|
|
||||||
403: `Forbidden — user is not allowed to modify this resource (e.g., not own profile & no admin rights)`,
|
|
||||||
404: `User not found`,
|
|
||||||
409: `Conflict — e.g., requested \`nickname\` or \`mail\` already taken by another user`,
|
|
||||||
422: `Unprocessable Entity — semantic errors not caught by schema (e.g., invalid \`avatar_id\`)`,
|
|
||||||
500: `Unknown server error`,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
/**
|
/**
|
||||||
* Get user titles
|
* Get user titles
|
||||||
* @param userId
|
* @param userId
|
||||||
* @param cursor
|
* @param cursor
|
||||||
* @param sort
|
|
||||||
* @param sortForward
|
|
||||||
* @param word
|
* @param word
|
||||||
* @param status List of title statuses to filter
|
* @param status
|
||||||
* @param watchStatus
|
* @param watchStatus
|
||||||
* @param rating
|
* @param rating
|
||||||
* @param myRate
|
|
||||||
* @param releaseYear
|
* @param releaseYear
|
||||||
* @param releaseSeason
|
* @param releaseSeason
|
||||||
* @param limit
|
* @param limit
|
||||||
* @param fields
|
* @param fields
|
||||||
* @returns any List of user titles
|
* @returns UserTitle List of user titles
|
||||||
* @throws ApiError
|
* @throws ApiError
|
||||||
*/
|
*/
|
||||||
public static getUsersTitles(
|
public static getUsersTitles(
|
||||||
userId: string,
|
userId: string,
|
||||||
cursor?: string,
|
cursor?: string,
|
||||||
sort?: TitleSort,
|
|
||||||
sortForward: boolean = true,
|
|
||||||
word?: string,
|
word?: string,
|
||||||
status?: Array<TitleStatus>,
|
status?: TitleStatus,
|
||||||
watchStatus?: Array<UserTitleStatus>,
|
watchStatus?: UserTitleStatus,
|
||||||
rating?: number,
|
rating?: number,
|
||||||
myRate?: number,
|
|
||||||
releaseYear?: number,
|
releaseYear?: number,
|
||||||
releaseSeason?: ReleaseSeason,
|
releaseSeason?: ReleaseSeason,
|
||||||
limit: number = 10,
|
limit: number = 10,
|
||||||
fields: string = 'all',
|
fields: string = 'all',
|
||||||
): CancelablePromise<{
|
): CancelablePromise<Array<UserTitle>> {
|
||||||
data: Array<UserTitle>;
|
|
||||||
cursor: CursorObj;
|
|
||||||
}> {
|
|
||||||
return __request(OpenAPI, {
|
return __request(OpenAPI, {
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
url: '/users/{user_id}/titles',
|
url: '/users/{user_id}/titles/',
|
||||||
path: {
|
path: {
|
||||||
'user_id': userId,
|
'user_id': userId,
|
||||||
},
|
},
|
||||||
query: {
|
query: {
|
||||||
'cursor': cursor,
|
'cursor': cursor,
|
||||||
'sort': sort,
|
|
||||||
'sort_forward': sortForward,
|
|
||||||
'word': word,
|
'word': word,
|
||||||
'status': status,
|
'status': status,
|
||||||
'watch_status': watchStatus,
|
'watch_status': watchStatus,
|
||||||
'rating': rating,
|
'rating': rating,
|
||||||
'my_rate': myRate,
|
|
||||||
'release_year': releaseYear,
|
'release_year': releaseYear,
|
||||||
'release_season': releaseSeason,
|
'release_season': releaseSeason,
|
||||||
'limit': limit,
|
'limit': limit,
|
||||||
|
|
@ -242,43 +175,4 @@ export class DefaultService {
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
/**
|
|
||||||
* Add a title to a user
|
|
||||||
* User adding title to list af watched, status required
|
|
||||||
* @param userId ID of the user to assign the title to
|
|
||||||
* @param requestBody
|
|
||||||
* @returns any Title successfully added to user
|
|
||||||
* @throws ApiError
|
|
||||||
*/
|
|
||||||
public static addUserTitle(
|
|
||||||
userId: number,
|
|
||||||
requestBody: UserTitle,
|
|
||||||
): CancelablePromise<{
|
|
||||||
data?: {
|
|
||||||
user_id: number;
|
|
||||||
title_id: number;
|
|
||||||
status: UserTitleStatus;
|
|
||||||
rate?: number;
|
|
||||||
review_id?: number;
|
|
||||||
ctime?: string;
|
|
||||||
};
|
|
||||||
}> {
|
|
||||||
return __request(OpenAPI, {
|
|
||||||
method: 'POST',
|
|
||||||
url: '/users/{user_id}/titles',
|
|
||||||
path: {
|
|
||||||
'user_id': userId,
|
|
||||||
},
|
|
||||||
body: requestBody,
|
|
||||||
mediaType: 'application/json',
|
|
||||||
errors: {
|
|
||||||
400: `Invalid request body (missing fields, invalid types, etc.)`,
|
|
||||||
401: `Unauthorized — missing or invalid auth token`,
|
|
||||||
403: `Forbidden — user not allowed to assign titles to this user`,
|
|
||||||
404: `User or Title not found`,
|
|
||||||
409: `Conflict — title already assigned to user (if applicable)`,
|
|
||||||
500: `Internal server error`,
|
|
||||||
},
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -41,9 +41,9 @@ export class AuthService {
|
||||||
pass: string;
|
pass: string;
|
||||||
},
|
},
|
||||||
): CancelablePromise<{
|
): CancelablePromise<{
|
||||||
|
success?: boolean;
|
||||||
error?: string | null;
|
error?: string | null;
|
||||||
user_id?: string | null;
|
user_id?: string | null;
|
||||||
user_name?: string | null;
|
|
||||||
}> {
|
}> {
|
||||||
return __request(OpenAPI, {
|
return __request(OpenAPI, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
|
|
|
||||||
|
|
@ -18,19 +18,17 @@ export const LoginPage: React.FC = () => {
|
||||||
try {
|
try {
|
||||||
if (isLogin) {
|
if (isLogin) {
|
||||||
const res = await AuthService.postAuthSignIn({ nickname, pass: password });
|
const res = await AuthService.postAuthSignIn({ nickname, pass: password });
|
||||||
if (res.user_id && res.user_name) {
|
if (res.success) {
|
||||||
// Сохраняем user_id и username в localStorage
|
// TODO: сохранить JWT в localStorage/cookie
|
||||||
localStorage.setItem("userId", res.user_id);
|
console.log("Logged in user id:", res.user_id);
|
||||||
localStorage.setItem("username", res.user_name);
|
navigate("/"); // редирект после успешного входа
|
||||||
|
|
||||||
navigate("/profile"); // редирект на профиль
|
|
||||||
} else {
|
} else {
|
||||||
setError(res.error || "Login failed");
|
setError(res.error || "Login failed");
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// SignUp оставляем без сохранения данных
|
|
||||||
const res = await AuthService.postAuthSignUp({ nickname, pass: password });
|
const res = await AuthService.postAuthSignUp({ nickname, pass: password });
|
||||||
if (res.user_id) {
|
if (res.success) {
|
||||||
|
console.log("User signed up with id:", res.user_id);
|
||||||
setIsLogin(true); // переключаемся на login после регистрации
|
setIsLogin(true); // переключаемся на login после регистрации
|
||||||
} else {
|
} else {
|
||||||
setError(res.error || "Sign up failed");
|
setError(res.error || "Sign up failed");
|
||||||
|
|
|
||||||
|
|
@ -1,183 +0,0 @@
|
||||||
// pages/UserPage/UserPage.tsx
|
|
||||||
import { useEffect, useState } from "react";
|
|
||||||
import { useParams } from "react-router-dom";
|
|
||||||
import { DefaultService } from "../../api/services/DefaultService";
|
|
||||||
import { SearchBar } from "../../components/SearchBar/SearchBar";
|
|
||||||
import { TitlesSortBox } from "../../components/TitlesSortBox/TitlesSortBox";
|
|
||||||
import { LayoutSwitch } from "../../components/LayoutSwitch/LayoutSwitch";
|
|
||||||
import { ListView } from "../../components/ListView/ListView";
|
|
||||||
import { TitleCardSquare } from "../../components/cards/TitleCardSquare";
|
|
||||||
import { TitleCardHorizontal } from "../../components/cards/TitleCardHorizontal";
|
|
||||||
import type { User, UserTitle, CursorObj, TitleSort } from "../../api";
|
|
||||||
|
|
||||||
const PAGE_SIZE = 10;
|
|
||||||
|
|
||||||
type UsersIdPageProps = {
|
|
||||||
userId?: string;
|
|
||||||
};
|
|
||||||
|
|
||||||
export default function UsersIdPage({ userId }: UsersIdPageProps) {
|
|
||||||
const params = useParams();
|
|
||||||
const id = userId || params?.id;
|
|
||||||
|
|
||||||
const [user, setUser] = useState<User | null>(null);
|
|
||||||
const [loadingUser, setLoadingUser] = useState(true);
|
|
||||||
const [errorUser, setErrorUser] = useState<string | null>(null);
|
|
||||||
|
|
||||||
// Для списка тайтлов
|
|
||||||
const [titles, setTitles] = useState<UserTitle[]>([]);
|
|
||||||
const [nextPage, setNextPage] = useState<UserTitle[]>([]);
|
|
||||||
const [cursor, setCursor] = useState<CursorObj | null>(null);
|
|
||||||
const [loadingTitles, setLoadingTitles] = useState(true);
|
|
||||||
const [loadingMore, setLoadingMore] = useState(false);
|
|
||||||
const [search, setSearch] = useState("");
|
|
||||||
const [sort, setSort] = useState<TitleSort>("id");
|
|
||||||
const [sortForward, setSortForward] = useState(true);
|
|
||||||
const [layout, setLayout] = useState<"square" | "horizontal">("square");
|
|
||||||
|
|
||||||
// --- Получение данных пользователя ---
|
|
||||||
useEffect(() => {
|
|
||||||
const fetchUser = async () => {
|
|
||||||
if (!id) return;
|
|
||||||
setLoadingUser(true);
|
|
||||||
try {
|
|
||||||
const result = await DefaultService.getUsers(id, "all");
|
|
||||||
setUser(result);
|
|
||||||
setErrorUser(null);
|
|
||||||
} catch (err: any) {
|
|
||||||
console.error(err);
|
|
||||||
setErrorUser(err?.message || "Failed to fetch user data");
|
|
||||||
} finally {
|
|
||||||
setLoadingUser(false);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
fetchUser();
|
|
||||||
}, [id]);
|
|
||||||
|
|
||||||
// --- Получение списка тайтлов пользователя ---
|
|
||||||
const fetchPage = async (cursorObj: CursorObj | null) => {
|
|
||||||
if (!id) return { items: [], nextCursor: null };
|
|
||||||
const cursorStr = cursorObj
|
|
||||||
? btoa(JSON.stringify(cursorObj)).replace(/\+/g, "-").replace(/\//g, "_").replace(/=+$/, "")
|
|
||||||
: "";
|
|
||||||
|
|
||||||
try {
|
|
||||||
const result = await DefaultService.getUsersTitles(
|
|
||||||
id,
|
|
||||||
cursorStr,
|
|
||||||
sort,
|
|
||||||
sortForward,
|
|
||||||
search.trim() || undefined,
|
|
||||||
undefined, // status фильтр, можно добавить
|
|
||||||
undefined, // watchStatus
|
|
||||||
undefined, // rating
|
|
||||||
undefined, // myRate
|
|
||||||
undefined, // releaseYear
|
|
||||||
undefined, // releaseSeason
|
|
||||||
PAGE_SIZE,
|
|
||||||
"all"
|
|
||||||
);
|
|
||||||
|
|
||||||
if (!result?.data?.length) return { items: [], nextCursor: null };
|
|
||||||
|
|
||||||
return { items: result.data, nextCursor: result.cursor ?? null };
|
|
||||||
} catch (err: any) {
|
|
||||||
if (err.status === 204) return { items: [], nextCursor: null };
|
|
||||||
throw err;
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
// Инициализация: загружаем сразу две страницы
|
|
||||||
useEffect(() => {
|
|
||||||
const initLoad = async () => {
|
|
||||||
setLoadingTitles(true);
|
|
||||||
setTitles([]);
|
|
||||||
setNextPage([]);
|
|
||||||
setCursor(null);
|
|
||||||
|
|
||||||
const firstPage = await fetchPage(null);
|
|
||||||
const secondPage = firstPage.nextCursor ? await fetchPage(firstPage.nextCursor) : { items: [], nextCursor: null };
|
|
||||||
|
|
||||||
setTitles(firstPage.items);
|
|
||||||
setNextPage(secondPage.items);
|
|
||||||
setCursor(secondPage.nextCursor);
|
|
||||||
setLoadingTitles(false);
|
|
||||||
};
|
|
||||||
initLoad();
|
|
||||||
}, [id, search, sort, sortForward]);
|
|
||||||
|
|
||||||
const handleLoadMore = async () => {
|
|
||||||
if (nextPage.length === 0) {
|
|
||||||
setLoadingMore(false);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
setLoadingMore(true);
|
|
||||||
|
|
||||||
setTitles(prev => [...prev, ...nextPage]);
|
|
||||||
setNextPage([]);
|
|
||||||
|
|
||||||
if (cursor) {
|
|
||||||
try {
|
|
||||||
const next = await fetchPage(cursor);
|
|
||||||
if (next.items.length > 0) setNextPage(next.items);
|
|
||||||
setCursor(next.nextCursor);
|
|
||||||
} catch (err) {
|
|
||||||
console.error(err);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
setLoadingMore(false);
|
|
||||||
};
|
|
||||||
|
|
||||||
const getAvatarUrl = (avatarId?: number) => (avatarId ? `/api/images/${avatarId}` : "/default-avatar.png");
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="w-full min-h-screen bg-gray-50 p-6 flex flex-col items-center">
|
|
||||||
|
|
||||||
{/* --- Карточка пользователя --- */}
|
|
||||||
{loadingUser && <div className="mt-10 text-xl font-medium">Loading user...</div>}
|
|
||||||
{errorUser && <div className="mt-10 text-red-600 font-medium">{errorUser}</div>}
|
|
||||||
{user && (
|
|
||||||
<div className="bg-white shadow-lg rounded-xl p-6 w-full max-w-sm flex flex-col items-center mb-8">
|
|
||||||
<img src={getAvatarUrl(user.avatar_id)} alt={user.nickname} className="w-32 h-32 rounded-full object-cover mb-4" />
|
|
||||||
<h2 className="text-2xl font-bold mb-2">{user.disp_name || user.nickname}</h2>
|
|
||||||
{user.mail && <p className="text-gray-600 mb-2">{user.mail}</p>}
|
|
||||||
{user.user_desc && <p className="text-gray-700 text-center">{user.user_desc}</p>}
|
|
||||||
{user.creation_date && <p className="text-gray-400 mt-4 text-sm">Registered: {new Date(user.creation_date).toLocaleDateString()}</p>}
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
|
|
||||||
{/* --- Панель поиска, сортировки и лейаута --- */}
|
|
||||||
<div className="w-full sm:w-4/5 flex flex-col sm:flex-row gap-4 mb-6 items-center">
|
|
||||||
<SearchBar placeholder="Search titles..." search={search} setSearch={setSearch} />
|
|
||||||
<LayoutSwitch layout={layout} setLayout={setLayout} />
|
|
||||||
<TitlesSortBox sort={sort} setSort={setSort} sortForward={sortForward} setSortForward={setSortForward} />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
{/* --- Список тайтлов --- */}
|
|
||||||
{loadingTitles && <div className="mt-6 font-medium text-black">Loading titles...</div>}
|
|
||||||
{!loadingTitles && titles.length === 0 && <div className="mt-6 font-medium text-black">No titles found.</div>}
|
|
||||||
|
|
||||||
{titles.length > 0 && (
|
|
||||||
<>
|
|
||||||
<ListView<UserTitle>
|
|
||||||
items={titles}
|
|
||||||
layout={layout}
|
|
||||||
hasMore={!!cursor || nextPage.length > 1}
|
|
||||||
loadingMore={loadingMore}
|
|
||||||
onLoadMore={handleLoadMore}
|
|
||||||
renderItem={(title, layout) =>
|
|
||||||
layout === "square" ? <TitleCardSquare title={title} /> : <TitleCardHorizontal title={title} />
|
|
||||||
}
|
|
||||||
/>
|
|
||||||
|
|
||||||
{!cursor && nextPage.length === 0 && (
|
|
||||||
<div className="mt-6 font-medium text-black">
|
|
||||||
Результатов больше нет, было найдено {titles.length} тайтлов.
|
|
||||||
</div>
|
|
||||||
)}
|
|
||||||
</>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue