2021-08-20 18:30:07 +03:00
|
|
|
import { FC, useEffect } from 'react';
|
|
|
|
import Message from '../utils/Message';
|
|
|
|
import { Result } from '../utils/Result';
|
|
|
|
import { ShlinkApiError } from '../api/ShlinkApiError';
|
|
|
|
import { SimpleCard } from '../utils/SimpleCard';
|
|
|
|
import SearchField from '../utils/SearchField';
|
2021-08-21 18:53:06 +03:00
|
|
|
import { ShlinkDomainRedirects } from '../api/types';
|
2021-12-09 15:44:29 +03:00
|
|
|
import { SelectedServer } from '../servers/data';
|
2021-08-20 18:31:42 +03:00
|
|
|
import { DomainsList } from './reducers/domainsList';
|
2021-08-21 18:53:06 +03:00
|
|
|
import { DomainRow } from './DomainRow';
|
2021-08-20 18:30:07 +03:00
|
|
|
|
|
|
|
interface ManageDomainsProps {
|
|
|
|
listDomains: Function;
|
2021-08-21 18:53:06 +03:00
|
|
|
filterDomains: (searchTerm: string) => void;
|
|
|
|
editDomainRedirects: (domain: string, redirects: Partial<ShlinkDomainRedirects>) => Promise<void>;
|
2021-08-20 18:30:07 +03:00
|
|
|
domainsList: DomainsList;
|
2021-12-09 15:44:29 +03:00
|
|
|
selectedServer: SelectedServer;
|
2021-08-20 18:30:07 +03:00
|
|
|
}
|
|
|
|
|
2021-08-21 18:53:06 +03:00
|
|
|
const headers = [ '', 'Domain', 'Base path redirect', 'Regular 404 redirect', 'Invalid short URL redirect', '' ];
|
2021-08-20 18:30:07 +03:00
|
|
|
|
2021-08-21 18:53:06 +03:00
|
|
|
export const ManageDomains: FC<ManageDomainsProps> = (
|
2021-12-09 15:44:29 +03:00
|
|
|
{ listDomains, domainsList, filterDomains, editDomainRedirects, selectedServer },
|
2021-08-21 18:53:06 +03:00
|
|
|
) => {
|
2021-12-09 15:44:29 +03:00
|
|
|
const { filteredDomains: domains, defaultRedirects, loading, error, errorData } = domainsList;
|
|
|
|
const resolvedDefaultRedirects = defaultRedirects ?? domains.find(({ isDefault }) => isDefault)?.redirects;
|
2021-08-20 18:30:07 +03:00
|
|
|
|
|
|
|
useEffect(() => {
|
|
|
|
listDomains();
|
|
|
|
}, []);
|
|
|
|
|
2021-08-21 18:53:06 +03:00
|
|
|
if (loading) {
|
|
|
|
return <Message loading />;
|
|
|
|
}
|
2021-08-20 18:30:07 +03:00
|
|
|
|
2021-08-21 18:53:06 +03:00
|
|
|
const renderContent = () => {
|
2021-08-20 18:30:07 +03:00
|
|
|
if (error) {
|
|
|
|
return (
|
|
|
|
<Result type="error">
|
2021-08-21 18:53:06 +03:00
|
|
|
<ShlinkApiError errorData={errorData} fallbackMessage="Error loading domains :(" />
|
2021-08-20 18:30:07 +03:00
|
|
|
</Result>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
return (
|
|
|
|
<SimpleCard>
|
|
|
|
<table className="table table-hover mb-0">
|
2021-08-22 11:46:47 +03:00
|
|
|
<thead className="responsive-table__header">
|
2021-08-21 18:53:06 +03:00
|
|
|
<tr>{headers.map((column, index) => <th key={index}>{column}</th>)}</tr>
|
2021-08-20 18:30:07 +03:00
|
|
|
</thead>
|
|
|
|
<tbody>
|
2021-08-21 18:53:06 +03:00
|
|
|
{domains.length < 1 && <tr><td colSpan={headers.length} className="text-center">No results found</td></tr>}
|
2021-08-20 18:30:07 +03:00
|
|
|
{domains.map((domain) => (
|
2021-08-21 18:53:06 +03:00
|
|
|
<DomainRow
|
|
|
|
key={domain.domain}
|
|
|
|
domain={domain}
|
|
|
|
editDomainRedirects={editDomainRedirects}
|
2021-12-09 15:44:29 +03:00
|
|
|
defaultRedirects={resolvedDefaultRedirects}
|
|
|
|
selectedServer={selectedServer}
|
2021-08-21 18:53:06 +03:00
|
|
|
/>
|
2021-08-20 18:30:07 +03:00
|
|
|
))}
|
|
|
|
</tbody>
|
|
|
|
</table>
|
|
|
|
</SimpleCard>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
return (
|
|
|
|
<>
|
2021-08-21 18:53:06 +03:00
|
|
|
<SearchField className="mb-3" onChange={filterDomains} />
|
2021-08-20 18:30:07 +03:00
|
|
|
{renderContent()}
|
|
|
|
</>
|
|
|
|
);
|
|
|
|
};
|