forked/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2026-03-03 06:11:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

Added new card in overview to display orphan visits

Browse Source
This commit is contained in:
Alejandro Celaya
2021-02-21 20:55:39 +01:00
parent 3c53f7d0fc
commit 5a373fd7ae
4 changed files with 27 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
src/api/types/index.ts
View File

@@ -46,6 +46,7 @@ export interface ShlinkVisits {
export interface ShlinkVisitsOverview {
visitsCount: number;
orphanVisitsCount?: number; // Optional only for versions older than 2.6.0
}
export interface ShlinkVisitsParams {

21
src/servers/Overview.tsx
View File

@@ -38,7 +38,7 @@ export const Overview = (
}: OverviewConnectProps) => {
const { loading, shortUrls } = shortUrlsList;
const { loading: loadingTags } = tagsList;
const { loading: loadingVisits, visitsCount } = visitsOverview;
const { loading: loadingVisits, visitsCount, orphanVisitsCount } = visitsOverview;
const serverId = isServerWithId(selectedServer) ? selectedServer.id : '';
const history = useHistory();
@@ -51,7 +51,7 @@ export const Overview = (
return (
<>
<div className="row mb-3">
<div className="col-md-6 col-lg-4">
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body>
<CardTitle tag="h5" className="overview__card-title">Visits</CardTitle>
<CardText tag="h2">
@@ -64,7 +64,20 @@ export const Overview = (
</CardText>
</Card>
</div>
<div className="col-md-6 col-lg-4">
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body>
<CardTitle tag="h5" className="overview__card-title">Orphan visits</CardTitle>
<CardText tag="h2">
<ForServerVersion minVersion="2.6.0">
{loadingVisits ? 'Loading...' : prettify(orphanVisitsCount ?? 0)}
</ForServerVersion>
<ForServerVersion maxVersion="2.5.*">
<small className="text-muted"><i>Shlink 2.6 is needed</i></small>
</ForServerVersion>
</CardText>
</Card>
</div>
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body>
<CardTitle tag="h5" className="overview__card-title">Short URLs</CardTitle>
<CardText tag="h2">
@@ -72,7 +85,7 @@ export const Overview = (
</CardText>
</Card>
</div>
<div className="col-md-12 col-lg-4">
<div className="col-md-6 col-xl-3">
<Card className="overview__card mb-2" body>
<CardTitle tag="h5" className="overview__card-title">Tags</CardTitle>
<CardText tag="h2">{loadingTags ? 'Loading...' : prettify(tagsList.tags.length)}</CardText>

4
src/visits/reducers/visitsOverview.ts
View File

@@ -13,6 +13,7 @@ export const GET_OVERVIEW = 'shlink/visitsOverview/GET_OVERVIEW';
export interface VisitsOverview {
visitsCount: number;
orphanVisitsCount?: number;
loading: boolean;
error: boolean;
}
@@ -21,6 +22,7 @@ export type GetVisitsOverviewAction = ShlinkVisitsOverview & Action<string>;
const initialState: VisitsOverview = {
visitsCount: 0,
orphanVisitsCount: 0,
loading: false,
error: false,
};
@@ -28,7 +30,7 @@ const initialState: VisitsOverview = {
export default buildReducer<VisitsOverview, GetVisitsOverviewAction & CreateVisitsAction>({
[GET_OVERVIEW_START]: () => ({ ...initialState, loading: true }),
[GET_OVERVIEW_ERROR]: () => ({ ...initialState, error: true }),
[GET_OVERVIEW]: (_, { visitsCount }) => ({ ...initialState, visitsCount }),
[GET_OVERVIEW]: (_, { visitsCount, orphanVisitsCount }) => ({ ...initialState, visitsCount, orphanVisitsCount }),
[CREATE_VISITS]: ({ visitsCount, ...rest }, { createdVisits }) => ({
...rest,
visitsCount: visitsCount + createdVisits.length,