c14e219bd9
* fix(ui): fix UI issues and file loading * fix(ui): rm logs * fix(ui): fixing UI problems with recordings * fix(ui): fix live session urls * fix(ui): fix jump to live
109 lines
5 KiB
TypeScript
109 lines
5 KiB
TypeScript
import React from 'react';
|
|
import LogoSmall from '../../../svg/logo-small.svg';
|
|
import NoResultsSVG from '../../../svg/no-results.svg';
|
|
import EmptyStateSvg from '../../../svg/empty-state.svg';
|
|
import DashboardSvg from '../../../svg/dashboard-icn.svg';
|
|
import LoaderSVG from '../../../svg/openreplay-preloader.svg';
|
|
import SignalGreenSvg from '../../../svg/signal-green.svg';
|
|
import SignalRedSvg from '../../../svg/signal-red.svg';
|
|
import NoBookmarks from '../../../svg/ca-no-bookmarked-session.svg';
|
|
import NoLiveSessions from '../../../svg/ca-no-live-sessions.svg';
|
|
import NoSessions from '../../../svg/ca-no-sessions.svg';
|
|
import NoSessionsInVault from '../../../svg/ca-no-sessions-in-vault.svg';
|
|
import NoWebhooks from '../../../svg/ca-no-webhooks.svg';
|
|
import NoMetadata from '../../../svg/ca-no-metadata.svg';
|
|
import NoIssues from '../../../svg/ca-no-issues.svg';
|
|
import NoAuditTrail from '../../../svg/ca-no-audit-trail.svg';
|
|
import NoAnnouncements from '../../../svg/ca-no-announcements.svg';
|
|
import NoAlerts from '../../../svg/ca-no-alerts.svg';
|
|
import NoNotes from '../../../svg/ca-no-notes.svg';
|
|
import NoCards from '../../../svg/ca-no-cards.svg';
|
|
import NoSearchResults from '../../../svg/ca-no-search-results.svg';
|
|
import NoDashboards from '../../../svg/ca-no-dashboards.svg';
|
|
import NoRecordings from '../../../svg/ca-no-recordings.svg';
|
|
|
|
export enum ICONS {
|
|
DASHBOARD_ICON = 'dashboard-icn',
|
|
EMPTY_STATE = 'empty-state',
|
|
LOGO_SMALL = 'logo-small',
|
|
NO_RESULTS = 'no-results',
|
|
LOADER = 'openreplay-preloader',
|
|
SIGNAL_GREEN = 'signal-green',
|
|
SIGNAL_RED = 'signal-red',
|
|
NO_BOOKMARKS = 'ca-no-bookmarked-session',
|
|
NO_LIVE_SESSIONS = 'ca-no-live-sessions',
|
|
NO_SESSIONS = 'ca-no-sessions',
|
|
NO_SESSIONS_IN_VAULT = 'ca-no-sessions-in-vault',
|
|
NO_WEBHOOKS = 'ca-no-webhooks',
|
|
NO_METADATA = 'ca-no-metadata',
|
|
NO_ISSUES = 'ca-no-issues',
|
|
NO_AUDIT_TRAIL = 'ca-no-audit-trail',
|
|
NO_ANNOUNCEMENTS = 'ca-no-announcements',
|
|
NO_ALERTS = 'ca-no-alerts',
|
|
NO_NOTES = 'ca-no-notes',
|
|
NO_CARDS = 'ca-no-cards',
|
|
NO_RECORDINGS = 'ca-no-recordings',
|
|
NO_SEARCH_RESULTS = 'ca-no-search-results',
|
|
NO_DASHBOARDS = 'ca-no-dashboards',
|
|
}
|
|
|
|
interface Props {
|
|
name: string;
|
|
size?: number;
|
|
}
|
|
function AnimatedSVG(props: Props) {
|
|
const { name, size = 24 } = props;
|
|
const renderSvg = () => {
|
|
switch (name) {
|
|
case ICONS.LOADER:
|
|
return <img style={{ width: size + 'px' }} src={LoaderSVG} />;
|
|
case ICONS.DASHBOARD_ICON:
|
|
return <img style={{ width: size + 'px' }} src={DashboardSvg} />;
|
|
case ICONS.EMPTY_STATE:
|
|
return <img style={{ width: size + 'px' }} src={EmptyStateSvg} />;
|
|
case ICONS.LOGO_SMALL:
|
|
return <img style={{ width: size + 'px' }} src={LogoSmall} />;
|
|
case ICONS.NO_RESULTS:
|
|
return <img style={{ width: size + 'px' }} src={NoResultsSVG} />;
|
|
case ICONS.SIGNAL_GREEN:
|
|
return <img style={{ width: size + 'px' }} src={SignalGreenSvg} />;
|
|
case ICONS.SIGNAL_RED:
|
|
return <img style={{ width: size + 'px' }} src={SignalRedSvg} />;
|
|
case ICONS.NO_BOOKMARKS:
|
|
return <img style={{ width: size + 'px' }} src={NoBookmarks} />;
|
|
case ICONS.NO_LIVE_SESSIONS:
|
|
return <img style={{ width: size + 'px' }} src={NoLiveSessions} />;
|
|
case ICONS.NO_SESSIONS:
|
|
return <img style={{ width: size + 'px' }} src={NoSessions} />;
|
|
case ICONS.NO_SESSIONS_IN_VAULT:
|
|
return <img style={{ width: size + 'px' }} src={NoSessionsInVault} />;
|
|
case ICONS.NO_WEBHOOKS:
|
|
return <img style={{ width: size + 'px' }} src={NoWebhooks} />;
|
|
case ICONS.NO_METADATA:
|
|
return <img style={{ width: size + 'px' }} src={NoMetadata} />;
|
|
case ICONS.NO_ISSUES:
|
|
return <img style={{ width: size + 'px' }} src={NoIssues} />;
|
|
case ICONS.NO_AUDIT_TRAIL:
|
|
return <img style={{ width: size + 'px' }} src={NoAuditTrail} />;
|
|
case ICONS.NO_ANNOUNCEMENTS:
|
|
return <img style={{ width: size + 'px' }} src={NoAnnouncements} />;
|
|
case ICONS.NO_ALERTS:
|
|
return <img style={{ width: size + 'px' }} src={NoAlerts} />;
|
|
case ICONS.NO_NOTES:
|
|
return <img style={{ width: size + 'px' }} src={NoNotes} />;
|
|
case ICONS.NO_CARDS:
|
|
return <img style={{ width: size + 'px' }} src={NoCards} />;
|
|
case ICONS.NO_SEARCH_RESULTS:
|
|
return <img style={{ width: size + 'px' }} src={NoSearchResults} />;
|
|
case ICONS.NO_DASHBOARDS:
|
|
return <img style={{ width: size + 'px' }} src={NoDashboards} />;
|
|
case ICONS.NO_RECORDINGS:
|
|
return <img style={{ width: size + 'px' }} src={NoRecordings} />;
|
|
default:
|
|
return null;
|
|
}
|
|
};
|
|
return <div>{renderSvg()}</div>;
|
|
}
|
|
|
|
export default AnimatedSVG;
|