/* eslint-disable object-curly-newline */
import Link from 'Elements/Link';
import Tooltip from 'Elements/Tooltip';
import type { ReactNode } from 'react';
import styled from 'styled-components';
import { Flex } from 'UIKit/grid';
import { min } from 'UIKit/mq';
import buildReadonly from '../builders/build-readonly';
import builders from './elements-builders';
import components from './elements-components';
import elementsProps from './elements-props';
import titles from './elements-titles';
import map from './map';
const ElementTitle = styled.h5`
color: rgba(0, 0, 0, 0.75);
font-weight: 600;
font-size: 13px;
line-height: 1.5;
margin: 0 8px 3px 0;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
${min('laptop')} {
font-size: 14px;
}
`;
function Head({ title, addon }: { title: string; addon?: ReactNode }) {
return (
{title}
{addon}
);
}
function Container({ children }: { children: ReactNode }) {
return {children};
}
type RenderProps = { render: () => JSX.Element };
const renderElements = (Object.keys(map) as (keyof typeof map)[]).reduce((acc, elementName) => {
const title = titles[elementName];
const valueName = map[elementName];
const Component = components[elementName];
const props = elementsProps[elementName];
const builder = builders[elementName];
const Element = builder(Component, {
elementName,
valueName,
});
acc[elementName] = {
render: () => (
),
};
return acc;
}, {} as Record);
const overrideRenderElements: Partial> = {
selectLead: {
render: () => {
const title = titles.selectLead;
const valueName = map.selectLead;
const Component = components.selectLead;
const props = elementsProps.selectLead;
const builder = builders.selectLead;
const Element = builder(Component, {
elementName: 'selectLead',
valueName,
});
const LinkComponent = buildReadonly(Link, {
elementName: 'linkLeadUrl',
valueName: 'leadUrl',
});
return (
} />
);
},
},
selectOpportunity: {
render: () => {
const title = titles.selectOpportunity;
const valueName = map.selectOpportunity;
const Component = components.selectOpportunity;
const props = elementsProps.selectOpportunity;
const builder = builders.selectOpportunity;
const Element = builder(Component, {
elementName: 'selectOpportunity',
valueName,
});
const LinkComponent = buildReadonly(Link, {
elementName: 'linkOpportunityUrl',
valueName: 'opportunityUrl',
});
return (
} />
);
},
},
selectQuote: {
render: () => {
const title = titles.selectQuote;
const valueName = map.selectQuote;
const Component = components.selectQuote;
const props = elementsProps.selectQuote;
const builder = builders.selectQuote;
const Element = builder(Component, {
elementName: 'selectQuote',
valueName,
});
const LinkComponent = buildReadonly(Link, {
elementName: 'linkQuoteUrl',
valueName: 'quoteUrl',
});
return (
} />
);
},
},
tbxVehicleTaxInYear: {
render: () => {
const title = titles.tbxVehicleTaxInYear;
const valueName = map.tbxVehicleTaxInYear;
const Component = components.tbxVehicleTaxInYear;
const props = elementsProps.tbxVehicleTaxInYear;
const builder = builders.tbxVehicleTaxInYear;
const Element = builder(Component, {
elementName: 'tbxVehicleTaxInYear',
valueName,
});
return (
);
},
},
selectHighSeasonStart: {
render: () => {
const title = titles.selectHighSeasonStart;
const valueName = map.selectHighSeasonStart;
const Component = components.selectHighSeasonStart;
const props = elementsProps.selectHighSeasonStart;
const builder = builders.selectHighSeasonStart;
const Element = builder(Component, {
elementName: 'selectHighSeasonStart',
valueName,
});
return (
);
},
},
};
export default Object.assign(renderElements, overrideRenderElements);