Skip to content

Commit

Permalink
fix(types/react): downgrade to <18
Browse files Browse the repository at this point in the history
  • Loading branch information
AmruthPillai committed Apr 8, 2022
1 parent bf7a168 commit fc77b54
Show file tree
Hide file tree
Showing 56 changed files with 889 additions and 1,964 deletions.
2 changes: 2 additions & 0 deletions CHANGELOG.md
Expand Up @@ -2,6 +2,8 @@

All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.

### [3.3.2](https://github.com/AmruthPillai/Reactive-Resume/compare/v3.3.1...v3.3.2) (2022-04-08)

### [3.3.1](https://github.com/AmruthPillai/Reactive-Resume/compare/v3.3.0...v3.3.1) (2022-04-08)

## [3.3.0](https://github.com/AmruthPillai/Reactive-Resume/compare/v3.2.11...v3.3.0) (2022-04-08)
Expand Down
18 changes: 9 additions & 9 deletions client/components/build/Center/ArtboardController.tsx
Expand Up @@ -52,7 +52,7 @@ const ArtboardController: React.FC<ReactZoomPanPinchRef> = ({ zoomIn, zoomOut, c
const url = getResumeUrl(resume, { withHost: true });
await navigator.clipboard.writeText(url);

toast.success(t('common.toast.success.resume-link-copied'));
toast.success(t<string>('common.toast.success.resume-link-copied'));
};

const handleExportPDF = async () => {
Expand All @@ -75,19 +75,19 @@ const ArtboardController: React.FC<ReactZoomPanPinchRef> = ({ zoomIn, zoomOut, c
})}
>
<div className={styles.controller}>
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.zoom-in') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.zoom-in')}>
<ButtonBase onClick={() => zoomIn(0.25)}>
<ZoomIn fontSize="medium" />
</ButtonBase>
</Tooltip>

<Tooltip arrow placement="top" title={t('builder.controller.tooltip.zoom-out') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.zoom-out')}>
<ButtonBase onClick={() => zoomOut(0.25)}>
<ZoomOut fontSize="medium" />
</ButtonBase>
</Tooltip>

<Tooltip arrow placement="top" title={t('builder.controller.tooltip.center-artboard') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.center-artboard')}>
<ButtonBase onClick={() => centerView(0.95)}>
<FilterCenterFocus fontSize="medium" />
</ButtonBase>
Expand All @@ -98,7 +98,7 @@ const ArtboardController: React.FC<ReactZoomPanPinchRef> = ({ zoomIn, zoomOut, c
{isDesktop && (
<>
{pages.length > 1 && (
<Tooltip arrow placement="top" title={t('builder.controller.tooltip.toggle-orientation') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.toggle-orientation')}>
<ButtonBase onClick={handleTogglePageOrientation}>
{orientation === 'vertical' ? (
<AlignHorizontalCenter fontSize="medium" />
Expand All @@ -109,13 +109,13 @@ const ArtboardController: React.FC<ReactZoomPanPinchRef> = ({ zoomIn, zoomOut, c
</Tooltip>
)}

<Tooltip arrow placement="top" title={t('builder.controller.tooltip.toggle-page-break-line') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.toggle-page-break-line')}>
<ButtonBase onClick={handleTogglePageBreakLine}>
<InsertPageBreak fontSize="medium" />
</ButtonBase>
</Tooltip>

<Tooltip arrow placement="top" title={t('builder.controller.tooltip.toggle-sidebars') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.toggle-sidebars')}>
<ButtonBase onClick={handleToggleSidebar}>
<ViewSidebar fontSize="medium" />
</ButtonBase>
Expand All @@ -125,13 +125,13 @@ const ArtboardController: React.FC<ReactZoomPanPinchRef> = ({ zoomIn, zoomOut, c
</>
)}

<Tooltip arrow placement="top" title={t('builder.controller.tooltip.copy-link') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.copy-link')}>
<ButtonBase onClick={handleCopyLink}>
<Link fontSize="medium" />
</ButtonBase>
</Tooltip>

<Tooltip arrow placement="top" title={t('builder.controller.tooltip.export-pdf') as string}>
<Tooltip arrow placement="top" title={t<string>('builder.controller.tooltip.export-pdf')}>
<ButtonBase onClick={handleExportPDF} disabled={isLoading}>
<Download fontSize="medium" />
</ButtonBase>
Expand Down
16 changes: 8 additions & 8 deletions client/components/build/Center/Header.tsx
Expand Up @@ -133,7 +133,7 @@ const Header = () => {
const url = getResumeUrl(resume, { withHost: true });
await navigator.clipboard.writeText(url);

toast.success(t('common.toast.success.resume-link-copied'));
toast.success(t<string>('common.toast.success.resume-link-copied'));
};

return (
Expand Down Expand Up @@ -166,42 +166,42 @@ const Header = () => {
<ListItemIcon>
<DriveFileRenameOutline className="scale-90" />
</ListItemIcon>
<ListItemText>{t('builder.header.menu.rename')}</ListItemText>
<ListItemText>{t<string>('builder.header.menu.rename')}</ListItemText>
</MenuItem>

<MenuItem onClick={handleDuplicate}>
<ListItemIcon>
<CopyAll className="scale-90" />
</ListItemIcon>
<ListItemText>{t('builder.header.menu.duplicate')}</ListItemText>
<ListItemText>{t<string>('builder.header.menu.duplicate')}</ListItemText>
</MenuItem>

{resume.public ? (
<MenuItem onClick={handleShareLink}>
<ListItemIcon>
<LinkIcon className="scale-90" />
</ListItemIcon>
<ListItemText>{t('builder.header.menu.share-link')}</ListItemText>
<ListItemText>{t<string>('builder.header.menu.share-link')}</ListItemText>
</MenuItem>
) : (
<Tooltip arrow placement="right" title={t('builder.header.menu.tooltips.share-link') as string}>
<Tooltip arrow placement="right" title={t<string>('builder.header.menu.tooltips.share-link')}>
<div>
<MenuItem>
<ListItemIcon>
<LinkIcon className="scale-90" />
</ListItemIcon>
<ListItemText>{t('builder.header.menu.share-link')}</ListItemText>
<ListItemText>{t<string>('builder.header.menu.share-link')}</ListItemText>
</MenuItem>
</div>
</Tooltip>
)}

<Tooltip arrow placement="right" title={t('builder.header.menu.tooltips.delete') as string}>
<Tooltip arrow placement="right" title={t<string>('builder.header.menu.tooltips.delete')}>
<MenuItem onClick={handleDelete}>
<ListItemIcon>
<Delete className="scale-90" />
</ListItemIcon>
<ListItemText>{t('builder.header.menu.delete')}</ListItemText>
<ListItemText>{t<string>('builder.header.menu.delete')}</ListItemText>
</MenuItem>
</Tooltip>
</Menu>
Expand Down
4 changes: 1 addition & 3 deletions client/components/build/Center/Page.tsx
Expand Up @@ -48,9 +48,7 @@ const Page: React.FC<Props> = ({ page, showPageNumbers = false }) => {
</div>

{showPageNumbers && (
<h4 className={styles.pageNumber}>
{t('builder.common.glossary.page')} {page + 1}
</h4>
<h4 className={styles.pageNumber}>{`${t<string>('builder.common.glossary.page')} {page + 1}`}</h4>
)}
</div>
);
Expand Down
4 changes: 3 additions & 1 deletion client/components/build/LeftSidebar/LeftSidebar.tsx
Expand Up @@ -114,7 +114,9 @@ const LeftSidebar = () => {

<div className="py-6 text-right">
<Button fullWidth variant="outlined" startIcon={<Add />} onClick={handleAddSection}>
{t('builder.common.actions.add', { token: t('builder.leftSidebar.sections.section.heading') })}
{t<string>('builder.common.actions.add', {
token: t<string>('builder.leftSidebar.sections.section.heading'),
})}
</Button>
</div>
</main>
Expand Down
20 changes: 12 additions & 8 deletions client/components/build/LeftSidebar/sections/Basics.tsx
Expand Up @@ -24,7 +24,7 @@ const Basics = () => {

return (
<>
<Heading path="sections.basics" name={t('builder.leftSidebar.sections.basics.heading')} />
<Heading path="sections.basics" name={t<string>('builder.leftSidebar.sections.basics.heading')} />

<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<div className="grid items-center gap-4 sm:col-span-2 sm:grid-cols-3">
Expand All @@ -33,10 +33,10 @@ const Basics = () => {
</div>

<div className="grid gap-2 w-full sm:col-span-2">
<ResumeInput label={t('builder.leftSidebar.sections.basics.name.label')} path="basics.name" />
<ResumeInput label={t<string>('builder.leftSidebar.sections.basics.name.label')} path="basics.name" />

<Button variant="outlined" startIcon={<PhotoFilter />} onClick={handleClick}>
{t('builder.leftSidebar.sections.basics.actions.photo-filters')}
{t<string>('builder.leftSidebar.sections.basics.actions.photo-filters')}
</Button>

<Popover
Expand All @@ -57,20 +57,24 @@ const Basics = () => {
</div>
</div>

<ResumeInput label={t('builder.common.form.email.label')} path="basics.email" className="sm:col-span-2" />
<ResumeInput label={t('builder.common.form.phone.label')} path="basics.phone" />
<ResumeInput label={t('builder.common.form.url.label')} path="basics.website" />
<ResumeInput
label={t<string>('builder.common.form.email.label')}
path="basics.email"
className="sm:col-span-2"
/>
<ResumeInput label={t<string>('builder.common.form.phone.label')} path="basics.phone" />
<ResumeInput label={t<string>('builder.common.form.url.label')} path="basics.website" />

<Divider className="sm:col-span-2" />

<ResumeInput
label={t('builder.leftSidebar.sections.basics.headline.label')}
label={t<string>('builder.leftSidebar.sections.basics.headline.label')}
path="basics.headline"
className="sm:col-span-2"
/>
<ResumeInput
type="textarea"
label={t('builder.common.form.summary.label')}
label={t<string>('builder.common.form.summary.label')}
path="basics.summary"
className="sm:col-span-2"
markdownSupported
Expand Down
21 changes: 15 additions & 6 deletions client/components/build/LeftSidebar/sections/Location.tsx
Expand Up @@ -8,19 +8,28 @@ const Location = () => {

return (
<>
<Heading path="sections.location" name={t('builder.leftSidebar.sections.location.heading')} />
<Heading path="sections.location" name={t<string>('builder.leftSidebar.sections.location.heading')} />

<div className="grid grid-cols-1 gap-4 sm:grid-cols-2">
<ResumeInput
label={t('builder.leftSidebar.sections.location.address.label')}
label={t<string>('builder.leftSidebar.sections.location.address.label')}
path="basics.location.address"
className="sm:col-span-2"
/>
<ResumeInput label={t('builder.leftSidebar.sections.location.city.label')} path="basics.location.city" />
<ResumeInput label={t('builder.leftSidebar.sections.location.region.label')} path="basics.location.region" />
<ResumeInput label={t('builder.leftSidebar.sections.location.country.label')} path="basics.location.country" />
<ResumeInput
label={t('builder.leftSidebar.sections.location.postal-code.label')}
label={t<string>('builder.leftSidebar.sections.location.city.label')}
path="basics.location.city"
/>
<ResumeInput
label={t<string>('builder.leftSidebar.sections.location.region.label')}
path="basics.location.region"
/>
<ResumeInput
label={t<string>('builder.leftSidebar.sections.location.country.label')}
path="basics.location.country"
/>
<ResumeInput
label={t<string>('builder.leftSidebar.sections.location.postal-code.label')}
path="basics.location.postalCode"
/>
</div>
Expand Down
12 changes: 7 additions & 5 deletions client/components/build/LeftSidebar/sections/PhotoFilters.tsx
Expand Up @@ -32,7 +32,7 @@ const PhotoFilters = () => {
return (
<div className="flex flex-col gap-2 p-5 dark:bg-neutral-800">
<div>
<h4 className="font-medium">{t('builder.leftSidebar.sections.basics.photo-filters.size.heading')}</h4>
<h4 className="font-medium">{t<string>('builder.leftSidebar.sections.basics.photo-filters.size.heading')}</h4>

<div className="mx-2">
<Slider
Expand All @@ -54,18 +54,20 @@ const PhotoFilters = () => {
<Divider />

<div>
<h4 className="font-medium">{t('builder.leftSidebar.sections.basics.photo-filters.effects.heading')}</h4>
<h4 className="font-medium">
{t<string>('builder.leftSidebar.sections.basics.photo-filters.effects.heading')}
</h4>

<div className="flex items-center">
<FormControlLabel
label={t('builder.leftSidebar.sections.basics.photo-filters.effects.grayscale.label') as string}
label={t<string>('builder.leftSidebar.sections.basics.photo-filters.effects.grayscale.label')}
control={
<Checkbox color="secondary" checked={grayscale} onChange={(_, value) => handleSetGrayscale(value)} />
}
/>

<FormControlLabel
label={t('builder.leftSidebar.sections.basics.photo-filters.effects.border.label') as string}
label={t<string>('builder.leftSidebar.sections.basics.photo-filters.effects.border.label')}
control={<Checkbox color="secondary" checked={border} onChange={(_, value) => handleSetBorder(value)} />}
/>
</div>
Expand All @@ -74,7 +76,7 @@ const PhotoFilters = () => {
<Divider />

<div className="flex flex-col gap-2">
<h4 className="font-medium">{t('builder.leftSidebar.sections.basics.photo-filters.shape.heading')}</h4>
<h4 className="font-medium">{t<string>('builder.leftSidebar.sections.basics.photo-filters.shape.heading')}</h4>

<ToggleButtonGroup exclusive value={shape} onChange={(_, value) => handleChangeShape(value)}>
<ToggleButton size="small" value="square" className="w-14">
Expand Down
6 changes: 3 additions & 3 deletions client/components/build/LeftSidebar/sections/PhotoUpload.tsx
Expand Up @@ -49,7 +49,7 @@ const PhotoUpload: React.FC = () => {
const file = event.target.files[0];

if (file.size > FILE_UPLOAD_MAX_SIZE) {
toast.error(t('common.toast.error.upload-photo-size'));
toast.error(t<string>('common.toast.error.upload-photo-size'));
return;
}

Expand All @@ -67,8 +67,8 @@ const PhotoUpload: React.FC = () => {
<Tooltip
title={
isEmpty(photo.url)
? (t('builder.leftSidebar.sections.basics.photo-upload.tooltip.upload') as string)
: (t('builder.leftSidebar.sections.basics.photo-upload.tooltip.remove') as string)
? (t<string>('builder.leftSidebar.sections.basics.photo-upload.tooltip.upload') as string)
: (t<string>('builder.leftSidebar.sections.basics.photo-upload.tooltip.remove') as string)
}
>
<Avatar sx={{ width: 96, height: 96 }} src={photo.url} />
Expand Down
6 changes: 3 additions & 3 deletions client/components/build/LeftSidebar/sections/Profiles.tsx
Expand Up @@ -28,7 +28,7 @@ const Profiles = () => {

return (
<>
<Heading path="sections.profiles" name={t('builder.leftSidebar.sections.profiles.heading')} />
<Heading path="sections.profiles" name={t<string>('builder.leftSidebar.sections.profiles.heading')} />

<List
path="basics.profiles"
Expand All @@ -40,8 +40,8 @@ const Profiles = () => {

<footer className="flex justify-end">
<Button variant="outlined" startIcon={<Add />} onClick={handleAdd}>
{t('builder.common.actions.add', {
token: t('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
{t<string>('builder.common.actions.add', {
token: t<string>('builder.leftSidebar.sections.profiles.heading', { count: 1 }),
})}
</Button>
</footer>
Expand Down
2 changes: 1 addition & 1 deletion client/components/build/LeftSidebar/sections/Section.tsx
Expand Up @@ -74,7 +74,7 @@ const Section: React.FC<Props> = ({
<SectionSettings path={path} />

<Button variant="outlined" startIcon={<Add />} onClick={handleAdd}>
{t('builder.common.actions.add', { token: heading })}
{t<string>('builder.common.actions.add', { token: heading })}
</Button>
</footer>
</>
Expand Down
Expand Up @@ -32,7 +32,7 @@ const SectionSettings: React.FC<Props> = ({ path }) => {

return (
<div>
<Tooltip title={t('builder.common.columns.tooltip') as string}>
<Tooltip title={t<string>('builder.common.columns.tooltip')}>
<ButtonBase onClick={handleClick} sx={{ padding: 1, borderRadius: 1 }} className="opacity-50 hover:opacity-75">
<ViewWeek /> <span className="ml-1.5 text-xs">{columns}</span>
</ButtonBase>
Expand All @@ -48,7 +48,7 @@ const SectionSettings: React.FC<Props> = ({ path }) => {
}}
>
<div className="p-5 dark:bg-neutral-800">
<h4 className="mb-2 font-medium">{t('builder.common.columns.heading')}</h4>
<h4 className="mb-2 font-medium">{t<string>('builder.common.columns.heading')}</h4>

<ToggleButtonGroup exclusive value={columns} onChange={(_, value: number) => handleSetColumns(value)}>
{[1, 2, 3, 4].map((index) => (
Expand Down
Expand Up @@ -25,7 +25,7 @@ const CustomCSS = () => {

return (
<>
<Heading path="metadata.css" name={t('builder.rightSidebar.sections.css.heading')} isHideable />
<Heading path="metadata.css" name={t<string>('builder.rightSidebar.sections.css.heading')} isHideable />

<Editor
height="200px"
Expand Down

0 comments on commit fc77b54

Please sign in to comment.