Skip to content
Extraits de code Groupes Projets
Valider 3d6c8ad0 rédigé par oussama aftys's avatar oussama aftys
Parcourir les fichiers

resolved live sorting problem

parent d0424f87
Branches
1 requête de fusion!143Update 2 files
Masquer les modifications d'espaces
En ligne Côte à côte
src/shared/api/live.ts
+ 15
− 2
Voir le fichier @ 3d6c8ad0
......@@ -10,6 +10,19 @@ const options = {
revalidateOnReconnect: false,
};
function sortLivesByStatus(lives: ILiveItem[]): ILiveItem[] {
const statusOrder = [LiveStatus.COMING, LiveStatus.ONGOING, LiveStatus.REVIEW, LiveStatus.REPLAY];
let liveToSort = lives;
return liveToSort.sort((a, b) => {
const statusA = a.status ? statusOrder.indexOf(a.status) : -1;
const statusB = b.status ? statusOrder.indexOf(b.status) : -1;
return statusA - statusB;
});
}
/////////////////////////////////////Live API/////////////////////////////////////
//////////////////////////////////////////////////////////////////////////////////
......@@ -21,7 +34,7 @@ export async function addLive(data: any) {
const response = await axiosInstance.post('/live', formData);
const newData: ILiveItem = response.data;
mutate([endpoints.live.stream], (lives: ILiveItem[] = []) => [...lives, newData], true);
mutate([endpoints.live.stream], (lives: ILiveItem[] = []) => [newData,...lives], true);
return newData;
}
......@@ -69,7 +82,7 @@ export function useGetLives() {
return useMemo(
() => ({
livesData: data || [],
livesData: sortLivesByStatus(data || []),
livesLoading: isLoading,
livesError: error,
livesValidating: isValidating,
......
src/shared/sections/lives/all-lives/view.tsx
+ 45
− 132
Voir le fichier @ 3d6c8ad0
'use client';
"use client";
import { useState, useCallback } from 'react';
......@@ -41,19 +42,24 @@ import LiveSearch from './live-search';
import TableHead from './live-table-head';
import { useGetLives } from '@/shared/api/live';
const defaultFilters: ILiveTableFilter = {
status: 'all',
startDate: null,
tags: [],
};
function sortLivesByStatus(lives: ILiveItem[]): ILiveItem[] {
const statusOrder = [LiveStatus.COMING, LiveStatus.ONGOING, LiveStatus.REVIEW, LiveStatus.REPLAY];
export default function AllLivesView() {
return lives.sort((a, b) => {
const statusA = a.status ? statusOrder.indexOf(a.status) : -1;
const statusB = b.status ? statusOrder.indexOf(b.status) : -1;
return statusA - statusB;
});
}
export default function AllLivesView() {
const theme = useTheme();
const settings = useSettingsContext();
const router = useRouter();
const table = useTable({ defaultOrderBy: 'startDate' });
......@@ -71,45 +77,24 @@ export default function AllLivesView() {
filters,
});
// Tri des lives par statut
const sortedData = sortLivesByStatus(dataFiltered);
const denseHeight = table.dense ? 56 : 56 + 20;
const canReset = filters.status !== 'all' || !!filters.tags.length || (!!filters.startDate);
const notFound = (!dataFiltered.length && canReset) || !dataFiltered.length;
const notFound = (!sortedData.length && canReset) || !sortedData.length;
const getLiveLength = (status: string) =>
livesData.filter((item) => item.status === status).length;
const TABS = [
{ value: 'all', label: 'Tout', color: 'default', count: livesData.length },
{
value: LiveStatus.COMING,
label: "à venir",
color: 'error',
count: getLiveLength(LiveStatus.COMING),
},
{
value: LiveStatus.ONGOING,
label: "en cours",
color: 'warning',
count: getLiveLength(LiveStatus.ONGOING),
},
{
value: LiveStatus.REVIEW,
label: "review",
color: 'info',
count: getLiveLength(LiveStatus.REVIEW),
},
{
value: LiveStatus.REPLAY,
label: "replay",
color: 'success',
count: getLiveLength(LiveStatus.REPLAY),
},
{ value: LiveStatus.COMING, label: "à venir", color: 'error', count: getLiveLength(LiveStatus.COMING) },
{ value: LiveStatus.ONGOING, label: "en cours", color: 'warning', count: getLiveLength(LiveStatus.ONGOING) },
{ value: LiveStatus.REVIEW, label: "review", color: 'info', count: getLiveLength(LiveStatus.REVIEW) },
{ value: LiveStatus.REPLAY, label: "replay", color: 'success', count: getLiveLength(LiveStatus.REPLAY) },
] as const;
const handleFilters = useCallback(
......@@ -123,34 +108,22 @@ export default function AllLivesView() {
[table]
);
const handleSearch = useCallback(
(inputValue: string) => {
// setSearch((prevState) => ({
// ...prevState,
// query: inputValue,
// }));
// if (inputValue) {
// const results = _lives.filter(
// (live) => live.title.toLowerCase().indexOf(search.query.toLowerCase()) !== -1
// );
// setSearch((prevState) => ({
// query:prevState.query,
// results,
// }));
// }
setSearch((prevState) => ({
...prevState,
query: inputValue,
}));
if (inputValue) {
const results = _lives.filter(
(live) => live.title.toLowerCase().indexOf(search.query.toLowerCase()) !== -1
);
}
},
[search.query]
);
//----------------------------------------------------------------------------------
const handleEditRow = useCallback(
(id: string) => {
......@@ -158,12 +131,14 @@ export default function AllLivesView() {
},
[router]
);
const handleViewStats = useCallback(
(id: string) => {
router.push(paths.dashboard.admin.live.statistics.single(id));
},
[router]
);
const handleViewInfo = useCallback(
(id: string) => {
router.push(paths.dashboard.live.info(id));
......@@ -178,10 +153,6 @@ export default function AllLivesView() {
[handleFilters]
);
//----------------view details--------------
const handleViewRow = useCallback(
(id: string) => {
router.push(paths.dashboard.admin.live.details(id));
......@@ -196,7 +167,6 @@ export default function AllLivesView() {
alignItems={{ xs: 'flex-end', sm: 'center' }}
direction={{ xs: 'column', sm: 'row' }}
>
<Button
component={RouterLink}
href={paths.dashboard.admin.live.new}
......@@ -211,59 +181,32 @@ export default function AllLivesView() {
onSearch={handleSearch}
hrefItem={(id: string) => paths.dashboard.admin.live.details(id)}
/>
</Stack>
);
/////////////////////////////
return (
<>
<LocalizationProvider >
<LocalizationProvider>
<Container maxWidth={settings.themeStretch ? false : 'lg'}>
<CustomBreadcrumbs
heading="Tout les lives"
links={[
{
name: 'dashboard',
href: paths.dashboard.root,
},
{
name: 'lives',
href: paths.dashboard.admin.live.all_lives,
},
{
name: 'Tout les lives',
},
{ name: 'dashboard', href: paths.dashboard.root },
{ name: 'lives', href: paths.dashboard.live.all_lives },
{ name: 'Tout les lives' },
]}
sx={{
mb: { xs: 3, md: 5 },
}}
sx={{ mb: { xs: 3, md: 5 } }}
/>
<Stack
spacing={2.5}
sx={{
mb: { xs: 3, md: 5 },
}}
>
<Stack spacing={2.5} sx={{ mb: { xs: 3, md: 5 } }}>
{renderSearch}
</Stack>
<Card>
<Tabs
value={filters.status}
onChange={handleFilterStatus}
sx={{
px: 2.5,
boxShadow: `inset 0 -2px 0 0 ${alpha(theme.palette.grey[500], 0.08)}`,
}}
sx={{ px: 2.5, boxShadow: `inset 0 -2px 0 0 ${alpha(theme.palette.grey[500], 0.08)}` }}
>
{TABS.map((tab) => (
<Tab
......@@ -273,9 +216,7 @@ export default function AllLivesView() {
iconPosition="end"
icon={
<Label
variant={
((tab.value === 'all' || tab.value === filters.status) && 'filled') || 'soft'
}
variant={(tab.value === 'all' || tab.value === filters.status) && 'filled' || 'soft'}
color={tab.color}
>
{tab.count}
......@@ -286,23 +227,12 @@ export default function AllLivesView() {
</Tabs>
<TableContainer sx={{ position: 'relative', overflow: 'unset' }}>
<Scrollbar>
<Table size={table.dense ? 'small' : 'medium'} sx={{ minWidth: 800 }}>
<TableHead
order={table.order}
orderBy={table.orderBy}
onSort={table.onSort}
/>
<TableHead order={table.order} orderBy={table.orderBy} onSort={table.onSort} />
<TableBody>
{dataFiltered
.slice(
table.page * table.rowsPerPage,
table.page * table.rowsPerPage + table.rowsPerPage
)
{sortedData
.slice(table.page * table.rowsPerPage, table.page * table.rowsPerPage + table.rowsPerPage)
.map((row) => (
<LiveTableRow
key={row.id}
......@@ -314,24 +244,15 @@ export default function AllLivesView() {
onEditRow={() => handleEditRow(row.id)}
/>
))}
<TableEmptyRows
height={denseHeight}
emptyRows={emptyRows(table.page, table.rowsPerPage, dataFiltered.length)}
/>
<TableEmptyRows height={denseHeight} emptyRows={emptyRows(table.page, table.rowsPerPage, sortedData.length)} />
<TableNoData notFound={notFound} />
</TableBody>
</Table>
</Scrollbar>
</TableContainer>
<TablePaginationCustom
count={dataFiltered.length}
count={sortedData.length}
page={table.page}
rowsPerPage={table.rowsPerPage}
onPageChange={table.onChangePage}
......@@ -340,16 +261,12 @@ export default function AllLivesView() {
onChangeDense={table.onChangeDense}
/>
</Card>
</Container>
</LocalizationProvider>
</>
);
}
function applyFilter({
inputData,
comparator,
......@@ -370,17 +287,13 @@ function applyFilter({
inputData = stabilizedThis.map((el) => el[0]);
if (status !== 'all') {
inputData = inputData.filter((live) => live.status === status);
}
if (tags.length) {
inputData = inputData.filter((live) => tags.includes(live.keyWord[0]));
}
return inputData;
}
src/shared/sections/lives/supervision/details-comments-input.tsx
+ 2
− 1
Voir le fichier @ 3d6c8ad0
......@@ -32,7 +32,8 @@ export default function CommentsInput({
await addCommentLive({
content: comment,
type: "CHAT",
sender: "1",
sender: "2",
admin: true,
senderName: liveData.chatName || "mydressin" ,
parent: parentComment ? parentComment : undefined,
liveStream: liveId
......
src/shared/types/live.ts
+ 3
− 2
Voir le fichier @ 3d6c8ad0
......@@ -7,9 +7,9 @@ export enum LiveStatus {
}
export enum LiveProductStatus {
PRESENTED ="PRESENTED",
PRESENTED = "PRESENTED",
NOT_PRESENTED = "NOT_PRESENTED",
IN_PRESENTATION ="IN_PRESENTATION"
IN_PRESENTATION = "IN_PRESENTATION"
}
export type ILive = {
......@@ -61,6 +61,7 @@ export type ILiveComment = {
content: string;
type?: string;
pinned?: boolean;
admin?: boolean;
senderName: string;
sender: string;
liveStream: string;
......
0% ou .
You are about to add 0 people to the discussion. Proceed with caution.
Terminez d'abord l'édition de ce message.
Veuillez vous inscrire ou vous pour commenter