38 lines
1.1 KiB
TypeScript
38 lines
1.1 KiB
TypeScript
import React from 'react';
|
|
import classNames from 'classnames';
|
|
import ServiceComponent from './containers/ServiceComponent';
|
|
import { Service } from 'services/domain/serviceEntity';
|
|
|
|
type Props = {
|
|
service: Service;
|
|
disabled?: boolean | undefined;
|
|
};
|
|
|
|
/**
|
|
* Service link component
|
|
* @param {Service} service Service object
|
|
* @return {JSX.Element}
|
|
*/
|
|
export default function ServiceLink({service, disabled = false}: Props) {
|
|
return (
|
|
<a
|
|
href={service.href}
|
|
className={classNames([
|
|
'box-border flex',
|
|
'transition-colors rounded-lg px-3 py-2',
|
|
'my-1 hover:bg-gray-400/10',
|
|
{'opacity-20 pointer-events-none': disabled},
|
|
])}
|
|
>
|
|
<ServiceComponent variant={service.variant} clipText={service.shortName}>
|
|
<div className="text-lg font-bold leading-tight">{service.name}</div>
|
|
{disabled ? (
|
|
<span className="text-xs text-right text-gray">soon</span>
|
|
) : (
|
|
<span className="text-xs text-gray-500">{service.href}</span>
|
|
)}
|
|
</ServiceComponent>
|
|
</a>
|
|
);
|
|
}
|