obsidian-plugin/ozntel_oz-calendar
1
0
Fork 0
mirror of https://github.com/ozntel/oz-calendar.git synced 2026-07-22 07:40:24 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

React Upgrade

Browse source
This commit is contained in:
Ozan Tellioglu 2023-11-26 21:21:31 +01:00
parent 2229d8c95c
commit 94e34eda3a
4 changed files with 11 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

9
package.json
View file

@ -14,9 +14,9 @@
"devDependencies": {
"@types/common-tags": "^1.8.1",
"@types/node": "^16.11.6",
"@types/react": "17.0.2",
"@types/react": "18.2.38",
"@types/react-calendar": "^3.9.0",
"@types/react-dom": "17.0.2",
"@types/react-dom": "18.2.17",
"@typescript-eslint/eslint-plugin": "5.29.0",
"@typescript-eslint/parser": "5.29.0",
"builtin-modules": "3.3.0",
@ -30,10 +30,9 @@
"@popperjs/core": "^2.11.6",
"common-tags": "^1.8.2",
"dayjs": "1.11.7",
"preact": "10",
"react": "npm:@preact/compat@17.0.2",
"react": "18.2.0",
"react-calendar": "4.0.0",
"react-dom": "npm:@preact/compat@17.0.2",
"react-dom": "18.2.0",
"react-icons": "4.8.0"
}
}

2
src/components/calendar.tsx
View file

@ -78,7 +78,7 @@ export default function MyCalendar(params: { plugin: OZCalendarPlugin }) {
return (
<div className="dots-wrapper">
{[...Array(Math.min(dotsCount, 2))].map((_, index) => (
<RxDotFilled viewBox="0 0 15 15" />
<RxDotFilled key={index} viewBox="0 0 15 15" />
))}
{dotsCount > 2 && <span>+{dotsCount - 2}</span>}
</div>

1
src/components/noteList.tsx
View file

@ -132,6 +132,7 @@ export default function NoteListComponent(params: NoteListComponentParams) {
: '')
}
id={notePath}
key={notePath}
onClick={(e) => openFilePath(e, notePath)}
onContextMenu={(e) => triggerFileContextMenu(e, notePath)}>
<HiOutlineDocumentText className="oz-calendar-note-line-icon" />

8
src/view.tsx
View file

@ -1,8 +1,8 @@
import { ItemView, WorkspaceLeaf } from 'obsidian';
import React from 'react';
import ReactDOM from 'react-dom';
import OZCalendarPlugin from './main';
import MyCalendar from './components/calendar';
import { createRoot, Root } from 'react-dom/client';
export const VIEW_TYPE = 'oz-calendar';
export const VIEW_DISPLAY_TEXT = 'OZ Calendar';
@ -10,6 +10,7 @@ export const ICON = 'OZCAL_ICON';
export class OZCalendarView extends ItemView {
plugin: OZCalendarPlugin;
root: Root;
constructor(leaf: WorkspaceLeaf, plugin: OZCalendarPlugin) {
super(leaf);
@ -33,11 +34,12 @@ export class OZCalendarView extends ItemView {
}
destroy() {
ReactDOM.unmountComponentAtNode(this.contentEl);
if (this.root) this.root.unmount();
}
async onOpen() {
this.destroy();
ReactDOM.render(<MyCalendar plugin={this.plugin} />, this.contentEl);
this.root = createRoot(this.contentEl)
this.root.render(<MyCalendar plugin={this.plugin} />);
}
}