1
0
Fork 0
mirror of https://github.com/anyproto/anytype-ts.git synced 2025-06-10 10:00:48 +09:00

refactoring

This commit is contained in:
Andrew Simachev 2024-03-30 15:37:21 +01:00
parent 61b9a5b690
commit 49611afeb7
No known key found for this signature in database
GPG key ID: 49A163D0D14E6FD8
12 changed files with 68 additions and 105 deletions

View file

@ -23,7 +23,7 @@
},
"icon": {
"text": "#fff",
"text": "#252525",
"bg": {
"grey": "#bfbfbf",
"black": "#252525",

View file

@ -1,6 +1,7 @@
import * as React from 'react';
import { I, UtilObject, Renderer, keyboard, sidebar, Preview } from 'Lib';
import { detailStore, menuStore } from 'Store';
import { I, UtilObject, Renderer, keyboard, sidebar, Preview, translate } from 'Lib';
import { Icon } from 'Component';
import { menuStore } from 'Store';
import HeaderAuthIndex from './auth';
import HeaderMainObject from './main/object';
@ -32,12 +33,14 @@ class Header extends React.Component<Props> {
constructor (props: Props) {
super(props);
this.menuOpen = this.menuOpen.bind(this);
this.renderLeftIcons = this.renderLeftIcons.bind(this);
this.renderTabs = this.renderTabs.bind(this);
this.onSearch = this.onSearch.bind(this);
this.onNavigation = this.onNavigation.bind(this);
this.onGraph = this.onGraph.bind(this);
this.onTooltipShow = this.onTooltipShow.bind(this);
this.onTooltipHide = this.onTooltipHide.bind(this);
this.menuOpen = this.menuOpen.bind(this);
this.onDoubleClick = this.onDoubleClick.bind(this);
};
@ -61,6 +64,8 @@ class Header extends React.Component<Props> {
onTooltipShow={this.onTooltipShow}
onTooltipHide={this.onTooltipHide}
menuOpen={this.menuOpen}
renderLeftIcons={this.renderLeftIcons}
renderTabs={this.renderTabs}
/>
</div>
);
@ -75,6 +80,43 @@ class Header extends React.Component<Props> {
this.refChild.forceUpdate();
};
renderLeftIcons (onOpen: () => void){
const cmd = keyboard.cmdSymbol();
return (
<React.Fragment>
<Icon
className="toggle"
tooltip={translate('sidebarToggle')}
tooltipCaption={`${cmd} + \\, ${cmd} + .`}
tooltipY={I.MenuDirection.Bottom}
onClick={() => sidebar.toggleExpandCollapse()}
/>
<Icon className="expand" tooltip={translate('commonOpenObject')} onClick={onOpen} />
</React.Fragment>
);
};
renderTabs () {
const { tab, tabs, onTab } = this.props;
return (
<div id="tabs" className="tabs">
{tabs.map((item: any, i: number) => (
<div
key={i}
className={[ 'tab', (item.id == tab ? 'active' : '') ].join(' ')}
onClick={() => onTab(item.id)}
onMouseOver={e => this.onTooltipShow(e, item.tooltip, item.tooltipCaption)}
onMouseOut={this.onTooltipHide}
>
{item.name}
</div>
))}
</div>
);
};
onSearch () {
keyboard.onSearchPopup('Header');
};

View file

@ -1,7 +1,6 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Icon } from 'Component';
import { I, UtilObject, keyboard, sidebar, translate } from 'Lib';
import { I, UtilObject } from 'Lib';
import { popupStore } from 'Store';
interface Props extends I.HeaderComponent {
@ -18,21 +17,13 @@ const HeaderMainEmpty = observer(class HeaderMainEmpty extends React.Component<P
};
render () {
const cmd = keyboard.cmdSymbol();
const { renderLeftIcons } = this.props;
return (
<React.Fragment>
<div className="side left">
<Icon
className="toggle"
tooltip={translate('sidebarToggle')}
tooltipCaption={`${cmd} + \\, ${cmd} + .`}
tooltipY={I.MenuDirection.Bottom}
onClick={() => sidebar.toggleExpandCollapse()}
/>
<Icon className="expand" tooltip={translate('commonOpenObject')} onClick={this.onOpen} />
{renderLeftIcons(this.onOpen)}
</div>
<div className="side center" />
<div className="side right" />
</React.Fragment>

View file

@ -1,6 +1,6 @@
import * as React from 'react';
import { Icon } from 'Component';
import { I, UtilObject, UtilData, keyboard, sidebar, translate } from 'Lib';
import { I, UtilObject, UtilData, translate } from 'Lib';
import { commonStore } from 'Store';
class HeaderMainGraph extends React.Component<I.HeaderComponent> {
@ -18,36 +18,16 @@ class HeaderMainGraph extends React.Component<I.HeaderComponent> {
};
render () {
const { tab, tabs, onTab, onTooltipShow, onTooltipHide } = this.props;
const cmd = keyboard.cmdSymbol();
const { renderLeftIcons, renderTabs } = this.props;
return (
<React.Fragment>
<div className="side left">
<Icon
className="toggle"
tooltip={translate('sidebarToggle')}
tooltipCaption={`${cmd} + \\, ${cmd} + .`}
tooltipY={I.MenuDirection.Bottom}
onClick={() => sidebar.toggleExpandCollapse()}
/>
<Icon className="expand" tooltip={translate('commonOpenObject')} onClick={this.onOpen} />
{renderLeftIcons(this.onOpen)}
</div>
<div className="side center">
<div id="tabs" className="tabs">
{tabs.map((item: any, i: number) => (
<div
key={i}
className={[ 'tab', (item.id == tab ? 'active' : '') ].join(' ')}
onClick={() => onTab(item.id)}
onMouseOver={e => onTooltipShow(e, item.tooltip, item.tooltipCaption)}
onMouseOut={onTooltipHide}
>
{item.name}
</div>
))}
</div>
{renderTabs()}
</div>
<div className="side right">

View file

@ -1,7 +1,6 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Icon } from 'Component';
import { I, UtilObject, keyboard, sidebar, translate } from 'Lib';
import { I, UtilObject } from 'Lib';
const HeaderMainNavigation = observer(class HeaderMainNavigation extends React.Component<I.HeaderComponent, object> {
@ -12,36 +11,16 @@ const HeaderMainNavigation = observer(class HeaderMainNavigation extends React.C
};
render () {
const { tabs, tab, onTab, onTooltipShow, onTooltipHide } = this.props;
const cmd = keyboard.cmdSymbol();
const { renderLeftIcons, renderTabs } = this.props;
return (
<React.Fragment>
<div className="side left">
<Icon
className="toggle"
tooltip={translate('sidebarToggle')}
tooltipCaption={`${cmd} + \\, ${cmd} + .`}
tooltipY={I.MenuDirection.Bottom}
onClick={() => sidebar.toggleExpandCollapse()}
/>
<Icon className="expand" tooltip={translate('commonOpenObject')} onClick={this.onOpen} />
{renderLeftIcons(this.onOpen)}
</div>
<div className="side center">
<div id="tabs" className="tabs">
{tabs.map((item: any, i: number) => (
<div
key={i}
className={[ 'tab', (item.id == tab ? 'active' : '') ].join(' ')}
onClick={() => onTab(item.id)}
onMouseOver={e => onTooltipShow(e, item.tooltip, item.tooltipCaption)}
onMouseOut={onTooltipHide}
>
{item.name}
</div>
))}
</div>
{renderTabs()}
</div>
<div className="side right" />

View file

@ -1,7 +1,7 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Icon, IconObject, Sync, ObjectName } from 'Component';
import { I, UtilObject, UtilData, keyboard, sidebar, translate } from 'Lib';
import { I, UtilObject, UtilData, keyboard, translate } from 'Lib';
import { blockStore, detailStore, popupStore } from 'Store';
import HeaderBanner from 'Component/page/elements/head/banner';
import Constant from 'json/constant.json';
@ -27,7 +27,7 @@ const HeaderMainObject = observer(class HeaderMainObject extends React.Component
};
render () {
const { rootId, onSearch, onTooltipShow, onTooltipHide, isPopup } = this.props;
const { rootId, onSearch, onTooltipShow, onTooltipHide, isPopup, renderLeftIcons } = this.props;
const { templatesCnt } = this.state;
const root = blockStore.getLeaf(rootId, rootId);
const object = detailStore.get(rootId, rootId, Constant.templateRelationKeys);
@ -75,14 +75,7 @@ const HeaderMainObject = observer(class HeaderMainObject extends React.Component
return (
<React.Fragment>
<div className="side left">
<Icon
className="toggle"
tooltip={translate('sidebarToggle')}
tooltipCaption={`${cmd} + \\, ${cmd} + .`}
tooltipY={I.MenuDirection.Bottom}
onClick={() => sidebar.toggleExpandCollapse()}
/>
<Icon className="expand" tooltip={translate('commonOpenObject')} onClick={this.onOpen} />
{renderLeftIcons(this.onOpen)}
{canSync ? <Sync id="button-header-sync" rootId={rootId} onClick={this.onSync} /> : ''}
</div>

View file

@ -1,7 +1,6 @@
import * as React from 'react';
import { observer } from 'mobx-react';
import { Icon } from 'Component';
import { I, UtilObject, keyboard, sidebar, translate } from 'Lib';
import { I, UtilObject } from 'Lib';
const HeaderMainStore = observer(class HeaderMainStore extends React.Component<I.HeaderComponent, object> {
@ -12,36 +11,16 @@ const HeaderMainStore = observer(class HeaderMainStore extends React.Component<I
};
render () {
const { tabs, tab, onTab, onTooltipShow, onTooltipHide } = this.props;
const cmd = keyboard.cmdSymbol();
const { renderLeftIcons, renderTabs } = this.props;
return (
<React.Fragment>
<div className="side left">
<Icon
className="toggle"
tooltip={translate('sidebarToggle')}
tooltipCaption={`${cmd} + \\, ${cmd} + .`}
tooltipY={I.MenuDirection.Bottom}
onClick={() => sidebar.toggleExpandCollapse()}
/>
<Icon className="expand" tooltip={translate('commonOpenObject')} onClick={this.onOpen} />
{renderLeftIcons(this.onOpen)}
</div>
<div className="side center">
<div id="tabs" className="tabs">
{tabs.map((item: any) => (
<div
key={`tab-store-${item.id}`}
className={[ 'tab', (item.id == tab ? 'active' : '') ].join(' ')}
onClick={() => onTab(item.id)}
onMouseOver={e => onTooltipShow(e, item.tooltip, item.tooltipCaption)}
onMouseOut={onTooltipHide}
>
{item.name}
</div>
))}
</div>
{renderTabs()}
</div>
<div className="side right" />

View file

@ -1,5 +1,5 @@
import * as React from 'react';
import { I, UtilCommon } from 'Lib';
import { I } from 'Lib';
import { commonStore } from 'Store';
import Constant from 'json/constant.json';

View file

@ -142,6 +142,8 @@ export interface HeaderComponent extends RouteComponentProps<any> {
tab?: string;
text?: string;
layout?: I.ObjectLayout;
renderLeftIcons?: (onOpen: () => void) => any;
renderTabs?: () => any;
onTab?: (id: string) => void;
onSearch?: () => void;
onNavigation?: () => void;

View file

@ -311,7 +311,6 @@ class CommonStore {
this.spaceId = String(id || '');
};
previewClear () {
this.previewObj = { type: null, target: null, element: null, range: { from: 0, to: 0 }, marks: [] };
};

View file

@ -1,4 +1,4 @@
import { makeObservable, observable, action, computed } from 'mobx';
import { makeObservable, observable, action } from 'mobx';
class ExtensionStore {

View file

@ -18,8 +18,6 @@ class NotificationStore {
return this.itemList || [];
};
set (list: I.Notification[]): void {
this.itemList = list.map(it => new M.Notification(it));
this.setBadge();