Skip to content
This repository has been archived by the owner on Feb 18, 2024. It is now read-only.

Commit

Permalink
Merge pull request #155 from PrivaNoteTeam/markdown-parsing-and-note-…
Browse files Browse the repository at this point in the history
…synchronization

Markdown Parsing
  • Loading branch information
oliviergoulet5 committed Nov 10, 2021
2 parents d5108c1 + d8f6e1a commit 46b96fe
Show file tree
Hide file tree
Showing 71 changed files with 3,015 additions and 1,265 deletions.
1,848 changes: 1,827 additions & 21 deletions client/package-lock.json

Large diffs are not rendered by default.

20 changes: 19 additions & 1 deletion client/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,8 +24,12 @@
"@testing-library/react": "^12.1.2",
"@testing-library/react-hooks": "^7.0.2",
"@types/jest": "^27.0.2",
"@types/marked": "^3.0.2",
"@types/mock-fs": "^4.13.1",
"@types/react": "^17.0.24",
"@types/react": "^17.0.33",
"@types/react-router": "^5.1.17",
"@types/react-router-dom": "^5.3.2",
"@types/react-syntax-highlighter": "^13.5.2",
"autoprefixer": "^10.3.5",
"babel-jest": "^27.2.5",
"css-loader": "^6.3.0",
Expand All @@ -39,6 +43,7 @@
"mini-css-extract-plugin": "^2.3.0",
"mock-fs": "^5.1.1",
"module-alias": "^2.2.2",
"node-loader": "^2.0.0",
"postcss-cli": "^8.3.1",
"postcss-loader": "^6.1.1",
"prettier": "2.4.1",
Expand All @@ -54,20 +59,33 @@
},
"dependencies": {
"@hookform/resolvers": "^2.8.1",
"@monaco-editor/react": "^4.3.1",
"@svgr/webpack": "^5.5.0",
"@tailwindcss/aspect-ratio": "^0.3.0",
"@types/axios": "^0.14.0",
"@types/react-dom": "^17.0.9",
"axios": "^0.23.0",
"babel-core": "^6.26.3",
"babel-preset-react": "^6.24.1",
"chokidar": "^3.5.2",
"google-auth-library": "^7.10.1",
"googleapis": "^89.0.0",
"highlight.js": "^11.3.1",
"html-react-parser": "^1.4.0",
"markdown-to-jsx": "^7.1.3",
"marked": "^3.0.8",
"monaco-editor": "^0.29.1",
"mrm": "^3.0.9",
"node-watch": "^0.7.2",
"nodemailer": "^6.7.0",
"react": "^17.0.2",
"react-collapse-pane": "^2.0.1",
"react-dom": "^17.0.2",
"react-dropzone": "^11.4.2",
"react-hook-form": "^7.16.1",
"react-router": "^5.2.1",
"react-router-dom": "^5.3.0",
"react-syntax-highlighter": "^15.4.4",
"typesafe-actions": "^5.1.0",
"yup": "^0.32.9"
}
Expand Down
43 changes: 31 additions & 12 deletions client/src/app/App.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,20 +9,22 @@ import { SideMenu } from '@components/SideMenu';
import { getUser } from '@shared/Api/getUser';
import { useIpcListeners } from './hooks/useIpcListeners';
import { useGoogleDrive } from './hooks/useGoogleDrive';
import { FileExplorer } from './components/FileExplorer';
import { Placeholder } from './components/Placeholder';
import { NotificationArea } from './components/NotificationArea';
import { SplitPane } from 'react-collapse-pane';

export const editorReducer = (state: EditorState, action: EditorAction) => {
switch (action.type) {
case 'primarySelect':
return { ...state, primarySelection: action.primarySelection };
return { ...state, primarySelection: action.primarySelection! };
case 'secondarySelect':
return { ...state, secondarySelection: action.secondarySelection };
case 'rename':
return { ...state, isRenaming: action.isRenaming };
return { ...state, secondarySelection: action.secondarySelection! };
}
};

export function App() {
const [{ currentNote, notebook }] = useStore();
const [{ currentFile, notebook }] = useStore();
const [, userDispatch] = useUserStore();

useIpcListeners();
Expand All @@ -32,17 +34,34 @@ export function App() {
getUser().then(({ user }) => {
if (user) userDispatch({ type: 'login', user });
});
}, [currentNote, notebook]);
}, [currentFile, notebook]);

return (
<>
<div className='bg-gray-800 w-screen h-screen flex'>
<div className='bg-gray-800 w-screen h-screen flex relative'>
<SideMenu />
<EditorProvider
initialState={{ isRenaming: false }}
reducer={editorReducer}
>
<EditorPanel />
<EditorProvider initialState={{}} reducer={editorReducer}>
{notebook ? (
<div className='relative flex-grow z-auto'>
<SplitPane
split='vertical'
initialSizes={[1, 5]}
resizerOptions={{
hoverCss: {
backgroundColor: 'rgb(59, 130, 246)'
}
}}
>
<FileExplorer />
<EditorPanel />
</SplitPane>
</div>
) : (
<div className='relative flex-grow flex flex-col'>
<NotificationArea />
<Placeholder text='Open a notebook to continue' />
</div>
)}
</EditorProvider>
<PageManager />
<ModalManager />
Expand Down
1 change: 1 addition & 0 deletions client/src/app/assets/icons/attachment.svg
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
12 changes: 10 additions & 2 deletions client/src/app/components/EditorPanel.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,15 @@ import { useEditorPanel } from './editorPanel/useEditorPanel';
import { UIEditorPanel } from './editorPanel/UIEditorPanel';

export function EditorPanel() {
const { fileExplorerVisible } = useEditorPanel();
const { text, setText, handlePreviewClose, livePreviewVisiable } =
useEditorPanel();

return <UIEditorPanel fileExplorerVisible={fileExplorerVisible} />;
return (
<UIEditorPanel
livePreviewVisiable={livePreviewVisiable}
text={text}
setText={setText}
handlePreviewClose={handlePreviewClose}
/>
);
}
Original file line number Diff line number Diff line change
@@ -1,20 +1,13 @@
import React from 'react';
import { FileSystemItem } from '@types';
import { UIFileExplorer } from './fileExplorer/UIFileExplorer';

import { useFileExplorer } from './fileExplorer/useFileExplorer';

interface Props {
items: FileSystemItem[];
}

export function FileExplorer({ items }: Props) {
export function FileExplorer() {
const {
items,
handleAddDirectoryClick,
handleAddFileClick,
handleOuterClick,
renameText,
setRenameText
handleOuterClick
} = useFileExplorer();

return (
Expand All @@ -23,8 +16,6 @@ export function FileExplorer({ items }: Props) {
handleAddDirectoryClick={handleAddDirectoryClick}
handleAddFileClick={handleAddFileClick}
handleOuterClick={handleOuterClick}
renameText={renameText}
setRenameText={setRenameText}
/>
);
}
73 changes: 33 additions & 40 deletions client/src/app/components/ModalManager.tsx
Original file line number Diff line number Diff line change
@@ -1,52 +1,45 @@
import React from 'react';
import { ipcRenderer } from 'electron';
import { Route, useHistory } from 'react-router';
import { CreateNotebookModal } from './CreateNotebookModal';
import { LoginModal } from './modalManager/LoginModal';
import { RegisterModal } from './modalManager/RegisterModal';
import { CreateNotebookModal } from './CreateNotebookModal';
import { ipcRenderer } from 'electron';
import { useModalStore } from '../hooks';
import { ResetPasswordModal } from './modalManager/ResetPasswordModal';
import { VerificiationModal } from './modalManager/VerificationModal';
import { TwoFactorAuthModal } from './modalManager/TwoFactorAuthModal';
import { ForgotPasswordModal } from './modalManager/ForgotPasswordModal';
import { ResetPasswordModal } from './modalManager/ResetPasswordModal';

export function ModalManager() {
const [
{
loginModalVisible,
registerModalVisible,
createNotebookModalVisible,
verificationModalVisible,
twoFactorAuthModalVisible,
forgotPasswordModalVisible,
resetPasswordModalVisible
},
modalManagerDispatch
] = useModalStore();

let history = useHistory();
ipcRenderer.on('createNotebook', () => {
modalManagerDispatch({
type: 'createNotebookModal',
createNotebookModalVisible: true
});
history.push('/notebook/create');
});

let render: JSX.Element | null = null;

if (loginModalVisible) {
render = <LoginModal />;
} else if (registerModalVisible) {
render = <RegisterModal />;
} else if (createNotebookModalVisible) {
render = <CreateNotebookModal />;
} else if (verificationModalVisible) {
render = <VerificiationModal />;
} else if (twoFactorAuthModalVisible) {
render = <TwoFactorAuthModal />;
} else if (forgotPasswordModalVisible) {
render = <ForgotPasswordModal />;
} else if (resetPasswordModalVisible) {
render = <ResetPasswordModal />;
}

return render;
return (
<>
<Route
path='/notebook/create'
children={<CreateNotebookModal />}
exact
/>
<Route path='/login' children={<LoginModal />} exact />
<Route path='/register' children={<RegisterModal />} exact />
<Route
path='/forgot-password'
children={<ForgotPasswordModal />}
exact
/>
<Route
path='/reset-password'
children={<ResetPasswordModal />}
exact
/>
<Route
path='/verification'
children={<VerificiationModal />}
exact
/>
<Route path='/2fa' children={<TwoFactorAuthModal />} exact />
</>
);
}
23 changes: 10 additions & 13 deletions client/src/app/components/PageManager.tsx
Original file line number Diff line number Diff line change
@@ -1,19 +1,16 @@
import React from 'react';
import { usePageStore } from '@hooks';
import { CloudProviderPage } from './pageManager/cloudProviderPage';
import { SelectCloudProviderPage } from './pageManager/selectCloudProviderPage';
import { Route } from 'react-router';

export function PageManager() {
const [{ cloudProviderPageVisible, selectCloudProviderPageVisible }] =
usePageStore();

let render: JSX.Element | null = null;

if (cloudProviderPageVisible) {
render = <CloudProviderPage />;
} else if (selectCloudProviderPageVisible) {
render = <SelectCloudProviderPage />;
}

return render;
return (
<>
<Route path='/cloudprovider' children={<CloudProviderPage />} />
<Route
path='/cloudprovider/select'
children={<SelectCloudProviderPage />}
/>
</>
);
}
2 changes: 1 addition & 1 deletion client/src/app/components/SideMenu.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import { useStore } from '@hooks';
export function SideMenu() {
const [{ notebook }] = useStore();
return (
<div className='flex flex-col-reverse bg-gray-700 p-3'>
<div className='flex flex-col-reverse bg-gray-700 p-3 flex-0'>
<div className='space-y-reverse space-y-2 inline-flex flex-col-reverse cursor-pointer'>
{notebook && <SettingsButton />}
<UserButton />
Expand Down
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import { useStore, useModalStore } from '@hooks';
import { useStore } from '@hooks';
import { createNotebook } from '@utils';
import { useForm } from 'react-hook-form';
import { yupResolver } from '@hookform/resolvers/yup';
import fs from 'fs';
import * as yup from 'yup';
import { useHistory } from 'react-router';

interface FormValues {
name: string;
Expand All @@ -22,13 +23,10 @@ const validationSchema = yup.object({

export function useCreateNotebookModal() {
const [, dispatch] = useStore();
const [, modalManagerDispatch] = useModalStore();
let history = useHistory();

const close = () => {
modalManagerDispatch({
type: 'createNotebookModal',
createNotebookModalVisible: false
});
history.push('/');
};

const {
Expand Down Expand Up @@ -67,7 +65,7 @@ export function useCreateNotebookModal() {

dispatch({
type: 'openNote',
currentNote: undefined
currentFile: undefined
});

dispatch({
Expand Down
9 changes: 7 additions & 2 deletions client/src/app/components/editorPanel/Editor.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,13 @@ import React from 'react';
import { useEditor } from './editor/useEditor';
import { UIEditor } from './editor/UIEditor';

export function Editor() {
const { unsaved, text, handleChange } = useEditor();
interface Props {
text: string;
setText: React.Dispatch<string>;
}

export function Editor({ text, setText }: Props) {
const { unsaved, handleChange } = useEditor({ text, setText });

return (
<UIEditor unsaved={unsaved} text={text} handleChange={handleChange} />
Expand Down
14 changes: 14 additions & 0 deletions client/src/app/components/editorPanel/Preview.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import React from 'react';
import { UIPreview } from './preview/UIPreview';
import { usePreview } from './preview/usePreview';

interface Props {
text: string;
onClose: () => void;
}

export function Preview({ text, onClose }: Props) {
const html = usePreview(text);

return <UIPreview content={html} handleClose={onClose} />;
}
Loading

0 comments on commit 46b96fe

Please sign in to comment.