updated pagination commit to carry

This commit is contained in:
berkay 2025-04-28 13:19:01 +03:00
parent ac344773c5
commit 2d418644bb
5 changed files with 228 additions and 179 deletions

View File

@ -144,6 +144,18 @@ class Pagination:
self.orderField = "uu_id"
self.orderType = "asc"
@property
def next_available(self) -> bool:
if self.page < self.total_pages:
return True
return False
@property
def back_available(self) -> bool:
if self.page > 1:
return True
return False
@property
def as_dict(self) -> Dict[str, Any]:
"""Convert pagination state to dictionary format."""
@ -157,6 +169,8 @@ class Pagination:
"pageCount": self.page_count,
"orderField": self.orderField,
"orderType": self.orderType,
"next": self.next_available,
"back": self.back_available,
}

View File

@ -1,7 +1,13 @@
"use client";
import React from "react";
import { Button } from "@/components/ui/button";
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
} from "@/components/ui/select";
import { PagePagination } from "./hooks";
import { getTranslation, LanguageKey } from "./language";
@ -12,12 +18,9 @@ interface PaginationToolsComponentProps {
lang: string;
}
export const PaginationToolsComponent: React.FC<PaginationToolsComponentProps> = ({
pagination,
updatePagination,
loading,
lang,
}) => {
export const PaginationToolsComponent: React.FC<
PaginationToolsComponentProps
> = ({ pagination, updatePagination, loading, lang }) => {
const t = getTranslation(lang as LanguageKey);
const handlePageChange = (newPage: number) => {
@ -35,15 +38,18 @@ export const PaginationToolsComponent: React.FC<PaginationToolsComponentProps> =
{(pagination.totalCount || pagination.allCount || 0) > 0
? (pagination.page - 1) * pagination.size + 1
: 0}{" "}
- {Math.min(
-{" "}
{Math.min(
pagination.page * pagination.size,
pagination.totalCount || pagination.allCount || 0
)} {t.of} {pagination.totalCount || pagination.allCount || 0}{" "}
{t.items}
)}{" "}
{t.of} {pagination.totalCount || pagination.allCount || 0} {t.items}
</div>
{pagination.totalCount && pagination.totalCount !== (pagination.allCount || 0) && (
{pagination.totalCount &&
pagination.totalCount !== (pagination.allCount || 0) && (
<div>
{t.total}: {pagination.allCount || 0} {t.items} ({t.filtered}: {pagination.totalCount} {t.items})
{t.total}: {pagination.allCount || 0} {t.items} ({t.filtered}:{" "}
{pagination.totalCount} {t.items})
</div>
)}
</div>
@ -54,25 +60,40 @@ export const PaginationToolsComponent: React.FC<PaginationToolsComponentProps> =
variant="outline"
size="sm"
onClick={() => handlePageChange(pagination.page - 1)}
disabled={pagination.page <= 1 || loading}
disabled={pagination.next}
>
{t.previous}
</Button>
{/* Page number buttons */}
<div className="flex items-center space-x-1">
{Array.from({ length: Math.min(5, Math.max(1, Math.ceil(
(pagination.totalCount && pagination.totalCount !== pagination.allCount
{Array.from(
{
length: Math.min(
5,
Math.max(
1,
Math.ceil(
(pagination.totalCount &&
pagination.totalCount !== pagination.allCount
? pagination.totalCount
: (pagination.allCount || 0)) / pagination.size
))) }, (_, i) => {
: pagination.allCount || 0) / pagination.size
)
)
),
},
(_, i) => {
// Show pages around current page
let pageNum;
const calculatedTotalPages = Math.max(1, Math.ceil(
(pagination.totalCount && pagination.totalCount !== pagination.allCount
const calculatedTotalPages = Math.max(
1,
Math.ceil(
(pagination.totalCount &&
pagination.totalCount !== pagination.allCount
? pagination.totalCount
: (pagination.allCount || 0)) / pagination.size
));
: pagination.allCount || 0) / pagination.size
)
);
if (calculatedTotalPages <= 5) {
pageNum = i + 1;
} else if (pagination.page <= 3) {
@ -95,29 +116,31 @@ export const PaginationToolsComponent: React.FC<PaginationToolsComponentProps> =
{pageNum}
</Button>
);
})}
}
)}
</div>
<Button
variant="outline"
size="sm"
onClick={() => handlePageChange(pagination.page + 1)}
disabled={pagination.page >= Math.max(1, Math.ceil(
(pagination.totalCount && pagination.totalCount !== pagination.allCount
? pagination.totalCount
: (pagination.allCount || 0)) / pagination.size
)) || loading}
disabled={pagination.back}
>
{t.next}
</Button>
{/* Page text display */}
<span className="px-4 py-1 text-sm text-muted-foreground">
{t.page} {pagination.page} {t.of} {Math.max(1, Math.ceil(
(pagination.totalCount && pagination.totalCount !== pagination.allCount
{t.page} {pagination.page} {t.of}{" "}
{Math.max(
1,
Math.ceil(
(pagination.totalCount &&
pagination.totalCount !== pagination.allCount
? pagination.totalCount
: (pagination.allCount || 0)) / pagination.size
))}
: pagination.allCount || 0) / pagination.size
)
)}
</span>
</div>
@ -129,7 +152,7 @@ export const PaginationToolsComponent: React.FC<PaginationToolsComponentProps> =
onValueChange={(value) => {
updatePagination({
size: Number(value),
page: 1 // Reset to first page when changing page size
page: 1, // Reset to first page when changing page size
});
}}
>

View File

@ -16,6 +16,8 @@ export interface ResponseMetadata {
totalPages: number;
pageCount: number;
allCount?: number;
next: boolean;
back: boolean;
}
export interface PagePagination extends RequestParams, ResponseMetadata {}
@ -39,6 +41,8 @@ export function useApplicationData() {
totalItems: 0,
totalPages: 0,
pageCount: 0,
next: true,
back: false,
});
const [loading, setLoading] = useState(false);
@ -66,6 +70,8 @@ export function useApplicationData() {
totalPages: result.pagination.totalPages || 1,
pageCount: result.pagination.pageCount || 0,
allCount: result.pagination.allCount || 0,
next: result.pagination.next || true,
back: result.pagination.back || false,
});
}
}
@ -99,7 +105,11 @@ export function useApplicationData() {
Object.entries(updates.query).forEach(([key, value]) => {
// Only transform string values that aren't already using a special operator
if (typeof value === 'string' && !key.includes('__') && value.trim() !== '') {
if (
typeof value === "string" &&
!key.includes("__") &&
value.trim() !== ""
) {
transformedQuery[`${key}__ilike`] = `%${value}%`;
} else {
transformedQuery[key] = value;
@ -109,7 +119,7 @@ export function useApplicationData() {
updates.query = transformedQuery;
// Always reset to page 1 when search query changes
if (!updates.hasOwnProperty('page')) {
if (!updates.hasOwnProperty("page")) {
updates.page = 1;
}
@ -120,6 +130,8 @@ export function useApplicationData() {
totalPages: 0,
pageCount: 0,
allCount: 0,
next: true,
back: false,
});
}
@ -132,9 +144,9 @@ export function useApplicationData() {
// Create a combined refetch function
const refetch = useCallback(() => {
// Reset pagination to page 1 when manually refetching
setRequestParams(prev => ({
setRequestParams((prev) => ({
...prev,
page: 1
page: 1,
}));
fetchApplicationsFromApi();
}, [fetchApplicationsFromApi]);

View File

@ -21,11 +21,11 @@ const ApplicationPage: React.FC<PageProps> = ({ lang = "en" }) => {
null
);
// State for sorting
const [sortField, setSortField] = useState<string | null>(null);
const [sortDirection, setSortDirection] = useState<"asc" | "desc" | null>(
null
);
// // State for sorting
// const [sortField, setSortField] = useState<string | null>(null);
// const [sortDirection, setSortDirection] = useState<"asc" | "desc" | null>(
// null
// );
// Available options for dropdowns
const urlOptions = [
@ -55,29 +55,29 @@ const ApplicationPage: React.FC<PageProps> = ({ lang = "en" }) => {
});
};
// Handle sorting
const handleSort = (field: string) => {
let direction: "asc" | "desc" | null = "asc";
// // Handle sorting
// const handleSort = (field: string) => {
// let direction: "asc" | "desc" | null = "asc";
if (sortField === field) {
// Toggle direction if same field is clicked
if (sortDirection === "asc") {
direction = "desc";
} else if (sortDirection === "desc") {
// Clear sorting if already desc
field = "";
direction = null;
}
}
// if (sortField === field) {
// // Toggle direction if same field is clicked
// if (sortDirection === "asc") {
// direction = "desc";
// } else if (sortDirection === "desc") {
// // Clear sorting if already desc
// field = "";
// direction = null;
// }
// }
setSortField(field || null);
setSortDirection(direction);
// setSortField(field || null);
// setSortDirection(direction);
updatePagination({
orderField: field ? [field] : [],
orderType: direction ? [direction] : [],
});
};
// updatePagination({
// orderField: field ? [field] : [],
// orderType: direction ? [direction] : [],
// });
// };
return (
<div className="container mx-auto px-4 py-6">
@ -99,14 +99,14 @@ const ApplicationPage: React.FC<PageProps> = ({ lang = "en" }) => {
lang={lang}
/>
{/* Sorting Component */}
{/* Sorting Component
<SortingComponent
sortField={sortField}
sortDirection={sortDirection}
onSort={handleSort}
translations={translations}
lang={lang}
/>
/> */}
{/* Data Display Component */}
<div className="mt-6">

View File

@ -1,17 +1,17 @@
services:
client_frontend:
container_name: client_frontend
build:
context: .
dockerfile: WebServices/client-frontend/Dockerfile
networks:
- wag-services
ports:
- "3000:3000"
environment:
- NODE_ENV=development
cpus: 1
mem_limit: 2048m
# client_frontend:
# container_name: client_frontend
# build:
# context: .
# dockerfile: WebServices/client-frontend/Dockerfile
# networks:
# - wag-services
# ports:
# - "3000:3000"
# environment:
# - NODE_ENV=development
# cpus: 1
# mem_limit: 2048m
# volumes:
# - client-frontend:/WebServices/client-frontend
@ -26,7 +26,7 @@ services:
- "3001:3001"
environment:
- NODE_ENV=development
cpus: 1
cpus: 2
mem_limit: 2048m
auth_service:
@ -56,59 +56,59 @@ services:
mem_limit: 512m
cpus: 0.5
identity_service:
container_name: identity_service
build:
context: .
dockerfile: ApiServices/IdentityService/Dockerfile
networks:
- wag-services
depends_on:
- initializer_service
env_file:
- api_env.env
environment:
- API_PATH=app:app
- API_HOST=0.0.0.0
- API_PORT=8002
- API_LOG_LEVEL=info
- API_RELOAD=1
- API_APP_NAME=evyos-identity-api-gateway
- API_TITLE=WAG API Identity Api Gateway
- API_FORGOT_LINK=https://identity_service/forgot-password
- API_DESCRIPTION=This api is serves as web identity api gateway only to evyos web services.
- API_APP_URL=https://identity_service
ports:
- "8002:8002"
mem_limit: 512m
cpus: 0.5
# identity_service:
# container_name: identity_service
# build:
# context: .
# dockerfile: ApiServices/IdentityService/Dockerfile
# networks:
# - wag-services
# depends_on:
# - initializer_service
# env_file:
# - api_env.env
# environment:
# - API_PATH=app:app
# - API_HOST=0.0.0.0
# - API_PORT=8002
# - API_LOG_LEVEL=info
# - API_RELOAD=1
# - API_APP_NAME=evyos-identity-api-gateway
# - API_TITLE=WAG API Identity Api Gateway
# - API_FORGOT_LINK=https://identity_service/forgot-password
# - API_DESCRIPTION=This api is serves as web identity api gateway only to evyos web services.
# - API_APP_URL=https://identity_service
# ports:
# - "8002:8002"
# mem_limit: 512m
# cpus: 0.5
building_service:
container_name: building_service
build:
context: .
dockerfile: ApiServices/BuildingService/Dockerfile
networks:
- wag-services
env_file:
- api_env.env
depends_on:
- initializer_service
environment:
- API_PATH=app:app
- API_HOST=0.0.0.0
- API_PORT=8003
- API_LOG_LEVEL=info
- API_RELOAD=1
- API_APP_NAME=evyos-building-api-gateway
- API_TITLE=WAG API Building Api Gateway
- API_FORGOT_LINK=https://building_service/forgot-password
- API_DESCRIPTION=This api is serves as web building api gateway only to evyos web services.
- API_APP_URL=https://building_service
ports:
- "8003:8003"
mem_limit: 512m
cpus: 0.5
# building_service:
# container_name: building_service
# build:
# context: .
# dockerfile: ApiServices/BuildingService/Dockerfile
# networks:
# - wag-services
# env_file:
# - api_env.env
# depends_on:
# - initializer_service
# environment:
# - API_PATH=app:app
# - API_HOST=0.0.0.0
# - API_PORT=8003
# - API_LOG_LEVEL=info
# - API_RELOAD=1
# - API_APP_NAME=evyos-building-api-gateway
# - API_TITLE=WAG API Building Api Gateway
# - API_FORGOT_LINK=https://building_service/forgot-password
# - API_DESCRIPTION=This api is serves as web building api gateway only to evyos web services.
# - API_APP_URL=https://building_service
# ports:
# - "8003:8003"
# mem_limit: 512m
# cpus: 0.5
management_service:
container_name: management_service
@ -151,17 +151,17 @@ services:
mem_limit: 512m
cpus: 0.5
dealer_service:
container_name: dealer_service
build:
context: .
dockerfile: ApiServices/DealerService/Dockerfile
networks:
- wag-services
env_file:
- api_env.env
mem_limit: 512m
cpus: 0.5
# dealer_service:
# container_name: dealer_service
# build:
# context: .
# dockerfile: ApiServices/DealerService/Dockerfile
# networks:
# - wag-services
# env_file:
# - api_env.env
# mem_limit: 512m
# cpus: 0.5
networks:
wag-services: