Skip to content

Commit

Permalink
Bugfixes and date formatting (#16)
Browse files Browse the repository at this point in the history
  • Loading branch information
@marlonbaeten
marlonbaeten authored Nov 24, 2022
1 parent 6efbbdf commit de6cc07
Show file tree
Hide file tree
Showing 22 changed files with 171 additions and 56 deletions.
2 changes: 2 additions & 0 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@
},
"dependencies": {
"buffer": "^6.0.3",
"luxon": "^3.1.0",
"react": "^18.2.0",
"react-dom": "^18.2.0",
"react-router5": "^8.0.1",
Expand All @@ -19,6 +20,7 @@
},
"devDependencies": {
"@playwright/test": "^1.27.0",
"@types/luxon": "^3.1.0",
"@types/react": "^18.0.21",
"@types/react-dom": "^18.0.6",
"@typescript-eslint/eslint-plugin": "^5.40.0",
Expand Down
20 changes: 18 additions & 2 deletions src/components/CasParents.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,34 +1,50 @@
import React from 'react';
import React, { useState } from 'react';
import { useRoute } from 'react-router5';
import Store from '../core/store';
import { NotificationType } from '../core/types';
import useNavigation from '../hooks/useNavigation';
import useStore from '../hooks/useStore';
import useTranslations from '../hooks/useTranslations';
import CasHeader from './CasHeader';
import ParentModal from './forms/ParentModal';
import Layout from './Layout';
import NotificationPopup from './NotificationPopup';
import ParentTableRow from './tables/ParentTableRow';

export default function CasParents() {
const t = useTranslations();
const { route } = useRoute();
const store = useStore() as Store;
const navigate = useNavigation();
const [loading, setLoading] = useState(false);

const syncParents = () => {
store.loadParents(true);
setLoading(true);
store.refreshParents().then(() => {
setLoading(false);
});
};

return (
<Layout>
{route.name === 'cas.parents.add' && (
<ParentModal />
)}
{loading && (
<NotificationPopup
notification={{
type: NotificationType.success,
message: t.caDetails.refresh.replace('{handle}', t.caDetails.parents.toLowerCase())
}}
onClose={() => setLoading(false)}
/>
)}
<CasHeader />
{store.parents && store.ca && store.parents[store.ca]?.map((parent) => (
<ParentTableRow
key={parent.name}
parent={parent}
loading={loading}
/>
))}
<button className="button" onClick={() => navigate({}, 'cas.parents.add')}>
Expand Down
22 changes: 19 additions & 3 deletions src/components/CasRepository.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from 'react';
import React, { useState } from 'react';
import Store from '../core/store';
import useStore from '../hooks/useStore';
import useTranslations from '../hooks/useTranslations';
Expand All @@ -8,15 +8,21 @@ import Layout from './Layout';
import useNavigation from '../hooks/useNavigation';
import RepoModal from './forms/RepoModal';
import { useRoute } from 'react-router5';
import NotificationPopup from './NotificationPopup';
import { NotificationType } from '../core/types';

export default function CasRepository() {
const t = useTranslations();
const store = useStore() as Store;
const navigate = useNavigation();
const { route } = useRoute();

const [loading, setLoading] = useState(false);

const syncRepo = () => {
store.loadRepoStatus(true);
setLoading(true);
store.refreshRepo().then(() => {
setLoading(false);
});
};

if (!store.ca) {
Expand All @@ -30,11 +36,21 @@ export default function CasRepository() {
{route.name === 'cas.repository.add' && (
<RepoModal />
)}
{loading && (
<NotificationPopup
notification={{
type: NotificationType.success,
message: t.caDetails.refresh.replace('{handle}', t.caDetails.repo.toLowerCase())
}}
onClose={() => setLoading(false)}
/>
)}
<CasHeader />
{isset ? (
<RepoTable
repo={store.repoStatus[store.ca]}
locale={store.locale}
loading={loading}
/>
) : (
<button className="button" onClick={() => navigate({}, 'cas.repository.add')}>
Expand Down
31 changes: 16 additions & 15 deletions src/components/forms/Edit.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -15,9 +15,10 @@ export default function Edit({ onClose, roa }: EditProps) {

return (
<>
<h3>{t.caDetails.addRoa}</h3>
<h3>{t.common.edit}</h3>
<form
onSubmit={(e) => {
console.log('submit');
e.preventDefault();
if (comment !== roa?.comment) {
navigate({ comment });
Expand All @@ -36,21 +37,21 @@ export default function Edit({ onClose, roa }: EditProps) {
onChange={(e) => setComment(e.target.value)}
/>
</div>
<div className="actions">
<button
className="button outline"
onClick={onClose}
>
{t.common.cancel}
</button>
<button
type="submit"
className="button"
>
{t.common.confirm}
</button>
</div>
</form>
<div className="actions">
<button
className="button outline"
onClick={onClose}
>
{t.common.cancel}
</button>
<button
type="submit"
className="button"
>
{t.common.confirm}
</button>
</div>
</>
);
}
11 changes: 8 additions & 3 deletions src/components/tables/ParentTableRow.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,17 @@ import useStore from '../../hooks/useStore';

export interface ParentTableRowProps {
parent: Parent,
loading: boolean,
}

export default function ParentTableRow({parent}: ParentTableRowProps) {
export default function ParentTableRow({parent, loading}: ParentTableRowProps) {
const t = useTranslations();
const { locale } = useStore();

const date = loading ?
t.caDetails.loading.replace('{handle}', '...') :
formatDate(parent.last_exchange.timestamp, locale);

return (
<div className="info-table">
<h4>{parent.name}</h4>
Expand All @@ -24,13 +29,13 @@ export default function ParentTableRow({parent}: ParentTableRowProps) {
<tr>
<th>{t.caDetails.lastExchange}</th>
<td>
<p>{formatDate(parent.last_exchange.timestamp, locale)}</p>
{parent.last_exchange.result != 'Success' ? (
<p className="failure">
{date}<br />
{parent.last_exchange.result.Failure.msg}
</p>
) :(
<p className="success" />
<p className="success">{date}</p>
)}
</td>
</tr>
Expand Down
15 changes: 10 additions & 5 deletions src/components/tables/RepoTable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,11 +6,16 @@ import { RepoStatus } from '../../core/types';
export interface RepoTableProps {
repo: RepoStatus,
locale: string,
loading: boolean,
}

export default function RepoTable({ repo, locale }: RepoTableProps) {
export default function RepoTable({ repo, locale , loading}: RepoTableProps) {
const t = useTranslations();

const date = loading ?
t.caDetails.loading.replace('{handle}', '...') :
formatDate(repo.last_exchange.timestamp, locale);

return (
<div className="info-table">
<table>
Expand All @@ -22,15 +27,15 @@ export default function RepoTable({ repo, locale }: RepoTableProps) {
<tr>
<th>{t.caDetails.lastExchange}</th>
<td>
<p>
{formatDate(repo.last_exchange.timestamp, locale)}
</p>
{repo.last_exchange.result != 'Success' ? (
<p className="failure">
{date}<br />
{repo.last_exchange.result.Failure.msg}
</p>
) : (
<p className="success" />
<p className="success">
{date}
</p>
)}
</td>
</tr>
Expand Down
16 changes: 8 additions & 8 deletions src/components/tables/RoaTableRow.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -44,6 +44,11 @@ export default function RoaTableRow({ roa, allowAdd, allowDelete, hasAnnouncemen
</td>
<td>
{roa.comment}
{allowDelete && (
<button className="button icon light right" onClick={() => navigate(params, 'cas.edit')}>
<img src={edit} />
</button>
)}
</td>
<td>
<span className={`state ${roa.state}`} title={helpText}>
Expand All @@ -63,14 +68,9 @@ export default function RoaTableRow({ roa, allowAdd, allowDelete, hasAnnouncemen
</button>
)}
{allowDelete && (
<>
<button className="button icon light" onClick={() => navigate(params, 'cas.edit')}>
<img src={edit} />
</button>
<button className="button icon" onClick={() => navigate(params, 'cas.delete')}>
<img src={trash} />
</button>
</>
<button className="button icon" onClick={() => navigate(params, 'cas.delete')}>
<img src={trash} />
</button>
)}
</td>
</tr>
Expand Down
8 changes: 8 additions & 0 deletions src/core/api.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -90,11 +90,19 @@ export default class Api {
.then((suggestions) => suggestions.map((suggestion) => ({id: generateId(10), ...suggestion})));
}

refreshCaParents(): Promise<void> {
return this.post('/api/v1/bulk/cas/sync/parent');
}

getCaParents(ca: string): Promise<Parent[]> {
return this.get<Record<string, ParentData>>(`/api/v1/cas/${ca}/parents`)
.then((data) => Object.entries(data).map(([name, parent]) => ({ name, ...parent })));
}

refreshCaRepo(): Promise<void> {
return this.post('/api/v1/bulk/cas/sync/repo');
}

getCaRepoStatus(ca: string): Promise<RepoStatus> {
return this.get<RepoStatus>(`/api/v1/cas/${ca}/repo/status`);
}
Expand Down
2 changes: 1 addition & 1 deletion src/core/handlers/handleCaData.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@ export default async function handleCaData(toState: State, store: Store) {
}

if (toState.name === 'cas.analyse') {
await store.loadSuggestions();
await store.loadSuggestions(true);
}

if (toState.name === 'cas.change' && toState.params.ids) {
Expand Down
46 changes: 45 additions & 1 deletion src/core/store.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@ import {
SuggestionField,
UserDetails,
} from './types';
import {compareRoa, compareSuggestion} from './utils';
import {compareRoa, compareSuggestion, prefixMaxLength} from './utils';

export default class Store implements Data {
// general purpose notification message
Expand Down Expand Up @@ -243,6 +243,28 @@ export default class Store implements Data {
});
}

async refreshParents() {
if (!this.ca) {
return;
}

const ca: string = this.ca;
await this.api.refreshCaParents();

// poll every 5 seconds for an update
return new Promise((resolve) => {
const interval = setInterval(() => {
this.api.getCaParents(ca).then((parents) => {
if (JSON.stringify(parents) !== JSON.stringify(this.parents[ca])) {
this.parents[ca] = parents;
clearInterval(interval);
resolve(parents);
}
});
}, 5 * 1000);
});
}

async loadParents(force?: boolean) {
if (!this.ca || (this.ca && this.parents[this.ca] && force !== true)) {
return;
Expand All @@ -267,6 +289,28 @@ export default class Store implements Data {
});
}

async refreshRepo() {
if (!this.ca) {
return;
}

const ca: string = this.ca;
await this.api.refreshCaRepo();

// poll every 5 seconds for an update
return new Promise((resolve) => {
const interval = setInterval(() => {
this.api.getCaRepoStatus(ca).then((status) => {
if (JSON.stringify(status) !== JSON.stringify(this.repoStatus[ca])) {
this.repoStatus[ca] = status;
clearInterval(interval);
resolve(status);
}
});
}, 5 * 1000);
});
}

async changeRoutes(add: Suggestion[], remove: Suggestion[]): Promise<boolean> {
if (this.ca === null) {
return false;
Expand Down
1 change: 1 addition & 0 deletions src/core/translations.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ export interface Translations {
},
caDetails: {
loading: string,
refresh: string,
current: string,
download: string,
noRoas: string,
Expand Down
Loading

0 comments on commit de6cc07

Please sign in to comment.