diff --git a/.eslintrc.json b/.eslintrc.json index d500d56ce..01512b396 100644 --- a/.eslintrc.json +++ b/.eslintrc.json @@ -1,15 +1,14 @@ { - "root": true, "ignorePatterns": ["/app"], "parser": "@typescript-eslint/parser", - "extends": ["plugin:@typescript-eslint/recommended", "plugin:prettier/recommended"], + "extends": ["plugin:@typescript-eslint/recommended"], "plugins": ["@typescript-eslint/eslint-plugin", "simple-import-sort", "unused-imports"], "rules": { - // Unused Imports + // ESLint "no-unused-vars": "off", - // Simple Import Sort - "simple-import-sort/imports": "error", - "simple-import-sort/exports": "error", + + // Unused Imports + "unused-imports/no-unused-imports": "error", "unused-imports/no-unused-vars": [ "warn", { @@ -19,7 +18,11 @@ "argsIgnorePattern": "^_" } ], - "unused-imports/no-unused-imports": "error", + + // Simple Import Sort + "simple-import-sort/imports": "error", + "simple-import-sort/exports": "error", + // TypeScript ESLint "@typescript-eslint/no-unused-vars": "off", "@typescript-eslint/no-explicit-any": "off", diff --git a/CHANGELOG.md b/CHANGELOG.md index 772f28cbb..a137a8fe6 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -2,6 +2,17 @@ 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.6.2](https://github.com/AmruthPillai/Reactive-Resume/compare/v3.5.3...v3.6.2) (2022-08-25) + +### Features + +- Implement Undo/Redo functionality across the resume builder section + +### Improvements + +- Update dependencies to the latest version +- Cleanup ESLint configuration, add tailwindCSS formatting + ### [3.5.3](https://github.com/AmruthPillai/Reactive-Resume/compare/v3.5.2...v3.5.3) (2022-08-11) ### [3.5.2](https://github.com/AmruthPillai/Reactive-Resume/compare/v3.5.1...v3.5.2) (2022-08-04) diff --git a/README.md b/README.md index 87141de35..a2802186f 100644 --- a/README.md +++ b/README.md @@ -18,7 +18,7 @@ You have complete control over what goes into your resume, how it looks, what co ## Table of Contents - [Reactive Resume](#reactive-resume) - - [Go to App](https://rxresu.me) | [Docs](https://docs.rxresu.me) + - [Go to App | [Docs](https://docs.rxresu.me)](#go-to-app--docs) - [Table of Contents](#table-of-contents) - [Features](#features) - [Languages](#languages) diff --git a/client/.eslintrc.json b/client/.eslintrc.json index ad2035036..b4780e2d9 100644 --- a/client/.eslintrc.json +++ b/client/.eslintrc.json @@ -1,9 +1,20 @@ { - "extends": ["../.eslintrc.json", "next/core-web-vitals"], + "extends": ["../.eslintrc.json", "next/core-web-vitals", "plugin:tailwindcss/recommended"], "ignorePatterns": [".next", "__ENV.js"], + "settings": { + "next": { + "rootDir": "client" + } + }, "rules": { + // Next.js "@next/next/no-img-element": "off", "@next/next/no-sync-scripts": "off", - "@next/next/no-html-link-for-pages": ["error", "pages"] + + // React Hooks + "react-hooks/exhaustive-deps": "off", + + // Tailwind CSS + "tailwindcss/no-custom-classname": ["warn", { "whitelist": ["preview-mode", "printer-mode", "markdown"] }] } } diff --git a/client/components/build/Center/ArtboardController.tsx b/client/components/build/Center/ArtboardController.tsx index fe3426c04..266c6dfcc 100644 --- a/client/components/build/Center/ArtboardController.tsx +++ b/client/components/build/Center/ArtboardController.tsx @@ -5,6 +5,8 @@ import { FilterCenterFocus, InsertPageBreak, Link, + RedoOutlined, + UndoOutlined, ViewSidebar, ZoomIn, ZoomOut, @@ -16,6 +18,7 @@ import { useTranslation } from 'next-i18next'; import toast from 'react-hot-toast'; import { useMutation } from 'react-query'; import { ReactZoomPanPinchRef } from 'react-zoom-pan-pinch'; +import { ActionCreators } from 'redux-undo'; import { ServerError } from '@/services/axios'; import { printResumeAsPdf, PrintResumeAsPdfParams } from '@/services/printer'; @@ -31,14 +34,18 @@ const ArtboardController: React.FC = ({ zoomIn, zoomOut, c const theme = useTheme(); const dispatch = useAppDispatch(); - const resume = useAppSelector((state) => state.resume); const isDesktop = useMediaQuery(theme.breakpoints.up('sm')); - const pages = useAppSelector((state) => state.resume.metadata.layout); + + const { past, present: resume, future } = useAppSelector((state) => state.resume); + const pages = get(resume, 'metadata.layout'); const { left, right } = useAppSelector((state) => state.build.sidebar); const orientation = useAppSelector((state) => state.build.page.orientation); const { mutateAsync, isLoading } = useMutation(printResumeAsPdf); + const handleUndo = () => dispatch(ActionCreators.undo()); + const handleRedo = () => dispatch(ActionCreators.redo()); + const handleTogglePageBreakLine = () => dispatch(togglePageBreakLine()); const handleTogglePageOrientation = () => dispatch(togglePageOrientation()); @@ -75,6 +82,20 @@ const ArtboardController: React.FC = ({ zoomIn, zoomOut, c })} >
+ ('builder.controller.tooltip.undo')}> + + + + + + ('builder.controller.tooltip.redo')}> + + + + + + + ('builder.controller.tooltip.zoom-in')}> zoomIn(0.25)}> @@ -97,17 +118,18 @@ const ArtboardController: React.FC = ({ zoomIn, zoomOut, c {isDesktop && ( <> - {pages.length > 1 && ( - ('builder.controller.tooltip.toggle-orientation')}> - - {orientation === 'vertical' ? ( - - ) : ( - - )} - - - )} + ('builder.controller.tooltip.toggle-orientation')}> + + {orientation === 'vertical' ? ( + + ) : ( + + )} + + ('builder.controller.tooltip.toggle-page-break-line')}> diff --git a/client/components/build/Center/Center.tsx b/client/components/build/Center/Center.tsx index eb5a0b60a..f93905054 100644 --- a/client/components/build/Center/Center.tsx +++ b/client/components/build/Center/Center.tsx @@ -13,7 +13,7 @@ import Page from './Page'; const Center = () => { const orientation = useAppSelector((state) => state.build.page.orientation); - const resume = useAppSelector((state) => state.resume); + const resume = useAppSelector((state) => state.resume.present); const layout: string[][][] = get(resume, 'metadata.layout'); if (isEmpty(resume)) return null; diff --git a/client/components/build/Center/Header.tsx b/client/components/build/Center/Header.tsx index 1fe53c705..6d1b3a5e9 100644 --- a/client/components/build/Center/Header.tsx +++ b/client/components/build/Center/Header.tsx @@ -57,7 +57,7 @@ const Header = () => { const { mutateAsync: deleteMutation } = useMutation(deleteResume); - const resume = useAppSelector((state) => state.resume); + const resume = useAppSelector((state) => state.resume.present); const { left, right } = useAppSelector((state) => state.build.sidebar); const name = useMemo(() => get(resume, 'name'), [resume]); diff --git a/client/components/build/Center/Page.tsx b/client/components/build/Center/Page.tsx index 04e0bd30e..24aa0eb96 100644 --- a/client/components/build/Center/Page.tsx +++ b/client/components/build/Center/Page.tsx @@ -20,7 +20,7 @@ type Props = PageProps & { const Page: React.FC = ({ page, showPageNumbers = false }) => { const { t } = useTranslation(); - const resume = useAppSelector((state) => state.resume); + const resume = useAppSelector((state) => state.resume.present); const breakLine: boolean = useAppSelector((state) => state.build.page.breakLine); const theme: Theme = get(resume, 'metadata.theme'); diff --git a/client/components/build/LeftSidebar/LeftSidebar.tsx b/client/components/build/LeftSidebar/LeftSidebar.tsx index d0cbae664..5431f4c92 100644 --- a/client/components/build/LeftSidebar/LeftSidebar.tsx +++ b/client/components/build/LeftSidebar/LeftSidebar.tsx @@ -25,7 +25,7 @@ const LeftSidebar = () => { const isDesktop = useMediaQuery(theme.breakpoints.up('lg')); - const sections = useAppSelector((state) => state.resume.sections); + const sections = useAppSelector((state) => state.resume.present.sections); const { open } = useAppSelector((state) => state.build.sidebar.left); const customSections = useMemo(() => getCustomSections(sections), [sections]); diff --git a/client/components/build/LeftSidebar/sections/Basics.tsx b/client/components/build/LeftSidebar/sections/Basics.tsx index 23c3be142..f2a6ca82f 100644 --- a/client/components/build/LeftSidebar/sections/Basics.tsx +++ b/client/components/build/LeftSidebar/sections/Basics.tsx @@ -32,7 +32,7 @@ const Basics = () => {
-
+
('builder.leftSidebar.sections.basics.name.label')} path="basics.name" />