mirror of
https://github.com/anyproto/anytype-ts.git
synced 2025-06-08 05:57:02 +09:00
JS-4200: PageMainType as functional component
This commit is contained in:
Andrew Simachev
parent
12e828ab08
commit
70f4b38101
14 changed files with 228 additions and 355 deletions
|
|
@ -2,7 +2,7 @@ import * as React from 'react';
|
|||
import $ from 'jquery';
|
||||
import { observer } from 'mobx-react';
|
||||
import { Button, Block, Loader, Icon, Select, IconObject, EmptySearch } from 'Component';
|
||||
import { I, C, M, S, U, translate } from 'Lib';
|
||||
import { I, C, M, S, U, J, translate } from 'Lib';
|
||||
|
||||
interface State {
|
||||
isLoading: boolean;
|
||||
|
|
@ -151,10 +151,9 @@ const Create = observer(class Create extends React.Component<I.PageComponent, St
|
|||
onSelect () {
|
||||
const { object } = this.state;
|
||||
const node = $(this.node);
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const filters: I.Filter[] = [
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.In, value: U.Object.getPageLayouts() },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: templateType?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template },
|
||||
];
|
||||
|
||||
S.Menu.open('searchObject', {
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
.titleWrap { display: flex; flex-direction: row; align-items: center; justify-content: space-between; margin: 0px 0px 8px 0px; padding: 0px 8px 0px 16px; }
|
||||
.titleWrap {
|
||||
.icon.withBackground { width: 24px !important; height: 24px !important; }
|
||||
.icon.plus { background-image: url('~img/icon/widget/plus.svg'); }
|
||||
.icon.plus { background-image: url('~img/icon/widget/plus0.svg'); }
|
||||
}
|
||||
|
||||
.title { @include text-paragraph; font-weight: 600; }
|
||||
|
|
|
|||
|
|
@ -1296,7 +1296,6 @@ const BlockDataview = observer(class BlockDataview extends React.Component<Props
|
|||
const targetId = this.getObjectId();
|
||||
const types = Relation.getSetOfObjects(rootId, targetId, I.ObjectLayout.Type);
|
||||
const skipLayouts = [ I.ObjectLayout.Participant ].concat(U.Object.getFileAndSystemLayouts());
|
||||
const templateType = S.Record.getTemplateType();
|
||||
|
||||
for (const type of types) {
|
||||
if (skipLayouts.includes(type.recommendedLayout)) {
|
||||
|
|
@ -1304,7 +1303,7 @@ const BlockDataview = observer(class BlockDataview extends React.Component<Props
|
|||
break;
|
||||
};
|
||||
|
||||
if (templateType && (type.id == templateType.id)) {
|
||||
if (type.uniqueKey == J.Constant.typeKey.template) {
|
||||
isAllowed = false;
|
||||
break;
|
||||
};
|
||||
|
|
|
|||
|
|
@ -195,10 +195,9 @@ const MenuTemplateList = observer(class MenuTemplateList extends React.Component
|
|||
const { param } = this.props;
|
||||
const { data } = param;
|
||||
const { typeId } = data;
|
||||
const templateType = S.Record.getTemplateType();
|
||||
|
||||
const filters: I.Filter[] = [
|
||||
{ relationKey: 'type', condition: I.FilterCondition.Equal, value: templateType?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.Equal, value: J.Constant.typeKey.template },
|
||||
{ relationKey: 'targetObjectType', condition: I.FilterCondition.In, value: typeId },
|
||||
];
|
||||
const sorts = [
|
||||
|
|
|
|||
|
|
@ -296,7 +296,6 @@ const MenuSearchObject = observer(class MenuSearchObject extends React.Component
|
|||
const { data } = param;
|
||||
const { type, dataMapper, dataSort, dataChange, skipIds, keys } = data;
|
||||
const filter = String(data.filter || '');
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const spaceId = data.spaceId || S.Common.space;
|
||||
|
||||
const filters: any[] = [
|
||||
|
|
@ -321,7 +320,7 @@ const MenuSearchObject = observer(class MenuSearchObject extends React.Component
|
|||
};
|
||||
if ([ I.NavigationType.Move, I.NavigationType.LinkTo, I.NavigationType.Link ].includes(type)) {
|
||||
filters.push({ relationKey: 'layout', condition: I.FilterCondition.NotIn, value: U.Object.getSystemLayouts() });
|
||||
filters.push({ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: templateType?.id });
|
||||
filters.push({ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template });
|
||||
};
|
||||
|
||||
if (clear) {
|
||||
|
|
|
|||
|
|
@ -235,10 +235,9 @@ const MenuWidget = observer(class MenuWidget extends React.Component<I.Menu> {
|
|||
|
||||
switch (item.itemId) {
|
||||
case 'source': {
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const filters: I.Filter[] = [
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.NotIn, value: U.Object.getSystemLayouts() },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: templateType?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template },
|
||||
];
|
||||
|
||||
menuId = 'searchObject';
|
||||
|
|
|
|||
|
|
@ -12,14 +12,9 @@ const PageMainChat = observer(forwardRef<{}, I.PageComponent>((props, ref) => {
|
|||
const headerRef = useRef(null);
|
||||
const idRef = useRef('');
|
||||
const [ isLoading, setIsLoading ] = useState(false);
|
||||
const [ isDeleted, setIsDeleted ] = useState(false);
|
||||
const rootId = props.rootId ? props.rootId : match?.params?.id;
|
||||
const object = S.Detail.get(rootId, rootId, [ 'chatId' ]);
|
||||
|
||||
if (isDeleted || object.isDeleted) {
|
||||
return <Deleted {...props} />;
|
||||
};
|
||||
|
||||
const open = () => {
|
||||
if (idRef.current == rootId) {
|
||||
return;
|
||||
|
|
@ -27,7 +22,6 @@ const PageMainChat = observer(forwardRef<{}, I.PageComponent>((props, ref) => {
|
|||
|
||||
close();
|
||||
setIsLoading(true);
|
||||
setIsDeleted(false);
|
||||
|
||||
idRef.current = rootId;
|
||||
|
||||
|
|
@ -99,12 +93,22 @@ const PageMainChat = observer(forwardRef<{}, I.PageComponent>((props, ref) => {
|
|||
});
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
return () => close();
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
open();
|
||||
resize();
|
||||
});
|
||||
|
||||
let content = null;
|
||||
let inner = null;
|
||||
|
||||
if (isLoading) {
|
||||
content = <Loader id="loader" />;
|
||||
inner = <Loader id="loader" />;
|
||||
} else {
|
||||
content = (
|
||||
inner = (
|
||||
<div className="blocks">
|
||||
<Block
|
||||
{...props}
|
||||
|
|
@ -121,33 +125,30 @@ const PageMainChat = observer(forwardRef<{}, I.PageComponent>((props, ref) => {
|
|||
);
|
||||
};
|
||||
|
||||
useEffect(() => {
|
||||
return () => close();
|
||||
}, []);
|
||||
if (object.isDeleted) {
|
||||
content = <Deleted {...props} />;
|
||||
} else {
|
||||
content = (
|
||||
<div ref={nodeRef}>
|
||||
<Header
|
||||
{...props}
|
||||
component="mainChat"
|
||||
ref={headerRef}
|
||||
rootId={object.chatId}
|
||||
/>
|
||||
|
||||
useEffect(() => {
|
||||
open();
|
||||
resize();
|
||||
});
|
||||
|
||||
return (
|
||||
<div ref={nodeRef}>
|
||||
<Header
|
||||
{...props}
|
||||
component="mainChat"
|
||||
ref={headerRef}
|
||||
rootId={object.chatId}
|
||||
/>
|
||||
|
||||
<div id="bodyWrapper" className="wrapper">
|
||||
<div className="editorWrapper isChat">
|
||||
{content}
|
||||
<div id="bodyWrapper" className="wrapper">
|
||||
<div className="editorWrapper isChat">
|
||||
{inner}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<Footer component="mainObject" {...props} />
|
||||
</div>
|
||||
);
|
||||
<Footer component="mainObject" {...props} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
return content;
|
||||
|
||||
}));
|
||||
|
||||
|
|
|
|||
|
|
@ -1,259 +1,73 @@
|
|||
import * as React from 'react';
|
||||
import React, { forwardRef, useState, useEffect, useRef } from 'react';
|
||||
import $ from 'jquery';
|
||||
import { observer } from 'mobx-react';
|
||||
import { Icon, Header, Footer, Loader, ListObjectPreview, ListObject, Deleted, HeadSimple } from 'Component';
|
||||
import { I, C, S, U, J, focus, Action, analytics, Relation, translate, sidebar } from 'Lib';
|
||||
|
||||
interface State {
|
||||
isLoading: boolean;
|
||||
isDeleted: boolean;
|
||||
};
|
||||
const PageMainType = observer(forwardRef<{}, I.PageComponent>((props, ref) => {
|
||||
|
||||
const PageMainType = observer(class PageMainType extends React.Component<I.PageComponent, State> {
|
||||
const { isPopup, match } = props;
|
||||
const [ isLoading, setIsLoading ] = useState(false);
|
||||
const headerRef = useRef(null);
|
||||
const headRef = useRef(null);
|
||||
const rootId = props.rootId || match?.params?.id;
|
||||
const type = S.Detail.get(rootId, rootId, U.Data.typeRelationKeys());
|
||||
const subIdTemplate = S.Record.getSubId(rootId, 'templates');
|
||||
const subIdObject = S.Record.getSubId(rootId, 'data');
|
||||
const idRef = useRef(null);
|
||||
const canShowTemplates = !U.Object.getLayoutsWithoutTemplates().includes(type.recommendedLayout) && (type.uniqueKey != J.Constant.typeKey.template);
|
||||
|
||||
_isMounted = false;
|
||||
id = '';
|
||||
refHeader: any = null;
|
||||
refHead: any = null;
|
||||
refControls: any = null;
|
||||
refListPreview: any = null;
|
||||
timeout = 0;
|
||||
page = 0;
|
||||
|
||||
state = {
|
||||
isLoading: false,
|
||||
isDeleted: false,
|
||||
};
|
||||
|
||||
constructor (props: I.PageComponent) {
|
||||
super(props);
|
||||
|
||||
this.onTemplateAdd = this.onTemplateAdd.bind(this);
|
||||
this.onObjectAdd = this.onObjectAdd.bind(this);
|
||||
this.onSetAdd = this.onSetAdd.bind(this);
|
||||
this.onCreate = this.onCreate.bind(this);
|
||||
this.onMore = this.onMore.bind(this);
|
||||
this.onEdit = this.onEdit.bind(this);
|
||||
};
|
||||
|
||||
render () {
|
||||
const { isLoading, isDeleted } = this.state;
|
||||
|
||||
if (isDeleted) {
|
||||
return <Deleted {...this.props} />;
|
||||
};
|
||||
|
||||
const rootId = this.getRootId();
|
||||
const type = this.getObject();
|
||||
|
||||
if (!type) {
|
||||
return null;
|
||||
};
|
||||
|
||||
const recommended = Relation.getArrayValue(type.recommendedRelations).map(id => S.Record.getRelationById(id)).filter(it => it).map(it => it.relationKey);
|
||||
|
||||
const subIdTemplate = this.getSubIdTemplate();
|
||||
const subIdObject = this.getSubIdObject();
|
||||
|
||||
const showTemplates = this.showTemplates();
|
||||
|
||||
const allowedObject = this.isAllowedObject();
|
||||
const allowedTemplate = this.isAllowedTemplate();
|
||||
|
||||
const templates = S.Record.getRecordIds(subIdTemplate, '');
|
||||
const totalObject = S.Record.getMeta(subIdObject, '').total;
|
||||
const totalTemplate = templates.length + (allowedTemplate ? 1 : 0);
|
||||
|
||||
const isFileType = U.Object.isInFileLayouts(type.recommendedLayout);
|
||||
const columns: any[] = [
|
||||
{
|
||||
relationKey: 'lastModifiedDate', name: translate('commonUpdated'),
|
||||
mapper: v => v ? U.Date.dateWithFormat(S.Common.dateFormat, v) : '',
|
||||
},
|
||||
];
|
||||
|
||||
if (!isFileType) {
|
||||
columns.push({ relationKey: 'creator', name: translate('commonOwner'), isObject: true });
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Header
|
||||
{...this.props}
|
||||
component="mainObject"
|
||||
ref={ref => this.refHeader = ref}
|
||||
rootId={rootId}
|
||||
/>
|
||||
|
||||
{isLoading ? <Loader id="loader" /> : ''}
|
||||
|
||||
<div className="blocks wrapper">
|
||||
<HeadSimple
|
||||
{...this.props}
|
||||
ref={ref => this.refHead = ref}
|
||||
placeholder={translate('defaultNameType')}
|
||||
rootId={rootId}
|
||||
onEdit={this.onEdit}
|
||||
/>
|
||||
|
||||
{showTemplates ? (
|
||||
<div className="section template">
|
||||
<div className="title">
|
||||
<div className="side left">
|
||||
{U.Common.plural(totalTemplate, translate('pluralTemplate'))}
|
||||
<span className="cnt">{totalTemplate}</span>
|
||||
</div>
|
||||
|
||||
<div className="side right">
|
||||
{allowedTemplate ? (
|
||||
<Icon
|
||||
className="plus withBackground"
|
||||
tooltip={translate('commonCreateNewTemplate')}
|
||||
onClick={this.onTemplateAdd}
|
||||
/>
|
||||
) : ''}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{totalTemplate ? (
|
||||
<div className="content">
|
||||
<ListObjectPreview
|
||||
key="listTemplate"
|
||||
getItems={() => S.Record.getRecords(subIdTemplate, [])}
|
||||
canAdd={allowedTemplate}
|
||||
onAdd={this.onTemplateAdd}
|
||||
onMenu={allowedTemplate ? (e: any, item: any) => this.onMenu(item) : null}
|
||||
onClick={(e: any, item: any) => this.templateOpen(item)}
|
||||
withBlank={true}
|
||||
blankId={J.Constant.templateId.blank}
|
||||
defaultId={type.defaultTemplateId || J.Constant.templateId.blank}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div className="empty">
|
||||
{translate('pageMainTypeNoTemplates')}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
) : ''}
|
||||
|
||||
{type.isInstalled ? (
|
||||
<div className="section set">
|
||||
<div className="title">
|
||||
<div className="side left">
|
||||
{U.Common.plural(totalObject, translate('pluralObject'))}
|
||||
<span className="cnt">{totalObject}</span>
|
||||
</div>
|
||||
|
||||
<div className="side right">
|
||||
<Icon
|
||||
id="button-create"
|
||||
className="more withBackground"
|
||||
onClick={this.onMore}
|
||||
/>
|
||||
|
||||
{allowedObject ? (
|
||||
<Icon
|
||||
className="plus withBackground"
|
||||
tooltip={translate('commonCreateNewObject')}
|
||||
onClick={this.onCreate}
|
||||
/>
|
||||
) : ''}
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<ListObject
|
||||
{...this.props}
|
||||
sources={[ rootId ]}
|
||||
spaceId={type.spaceId}
|
||||
subId={subIdObject}
|
||||
rootId={rootId}
|
||||
columns={columns}
|
||||
relationKeys={recommended}
|
||||
route={analytics.route.screenType}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
) : ''}
|
||||
</div>
|
||||
|
||||
<Footer component="mainObject" {...this.props} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
componentDidMount () {
|
||||
this._isMounted = true;
|
||||
this.open();
|
||||
};
|
||||
|
||||
componentDidUpdate () {
|
||||
this.open();
|
||||
};
|
||||
|
||||
componentWillUnmount () {
|
||||
this._isMounted = false;
|
||||
this.close();
|
||||
};
|
||||
|
||||
open () {
|
||||
const rootId = this.getRootId();
|
||||
|
||||
if (this.id == rootId) {
|
||||
const open = () => {
|
||||
if (idRef.current == rootId) {
|
||||
return;
|
||||
};
|
||||
|
||||
this.close();
|
||||
this.id = rootId;
|
||||
this.setState({ isLoading: true });
|
||||
close();
|
||||
setIsLoading(true);
|
||||
|
||||
idRef.current = rootId;
|
||||
|
||||
C.ObjectOpen(rootId, '', U.Router.getRouteSpaceId(), (message: any) => {
|
||||
setIsLoading(false);
|
||||
|
||||
if (!U.Common.checkErrorOnOpen(rootId, message.error.code, this)) {
|
||||
return;
|
||||
};
|
||||
|
||||
const object = S.Detail.get(rootId, rootId, []);
|
||||
if (object.isDeleted) {
|
||||
this.setState({ isDeleted: true, isLoading: false });
|
||||
return;
|
||||
};
|
||||
|
||||
this.refHeader?.forceUpdate();
|
||||
this.refHead?.forceUpdate();
|
||||
this.refControls?.forceUpdate();
|
||||
headerRef.current.forceUpdate();
|
||||
headRef.current.forceUpdate();
|
||||
sidebar.rightPanelSetState({ rootId });
|
||||
this.setState({ isLoading: false });
|
||||
this.loadTemplates();
|
||||
|
||||
loadTemplates();
|
||||
});
|
||||
};
|
||||
|
||||
close () {
|
||||
if (!this.id) {
|
||||
const close = () => {
|
||||
if (!idRef.current) {
|
||||
return;
|
||||
};
|
||||
|
||||
const { isPopup, match } = this.props;
|
||||
const close = !(isPopup && (match?.params?.id == this.id));
|
||||
const close = !(isPopup && (match?.params?.id == idRef.current));
|
||||
|
||||
if (close) {
|
||||
Action.pageClose(this.id, true);
|
||||
Action.pageClose(idRef.current, true);
|
||||
};
|
||||
};
|
||||
|
||||
loadTemplates () {
|
||||
const type = this.getObject();
|
||||
if (!type) {
|
||||
return;
|
||||
};
|
||||
|
||||
const template = S.Record.getTemplateType();
|
||||
const loadTemplates = () => {
|
||||
const type = S.Detail.get(rootId, rootId);
|
||||
|
||||
U.Data.searchSubscribe({
|
||||
spaceId: type.spaceId,
|
||||
subId: this.getSubIdTemplate(),
|
||||
subId: subIdTemplate,
|
||||
filters: [
|
||||
{ relationKey: 'targetObjectType', condition: I.FilterCondition.Equal, value: type.id },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.Equal, value: template.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.Equal, value: J.Constant.typeKey.template },
|
||||
],
|
||||
sorts: [
|
||||
{ relationKey: 'lastModifiedDate', type: I.SortType.Desc },
|
||||
|
|
@ -263,12 +77,7 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
});
|
||||
};
|
||||
|
||||
onTemplateAdd () {
|
||||
const type = this.getObject();
|
||||
if (!type) {
|
||||
return;
|
||||
};
|
||||
|
||||
const onTemplateAdd = () => {
|
||||
const details: any = {
|
||||
targetObjectType: type.id,
|
||||
layout: type.recommendedLayout,
|
||||
|
|
@ -282,34 +91,17 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
focus.clear(true);
|
||||
analytics.event('CreateTemplate', { objectType: type.id, route: analytics.route.store });
|
||||
|
||||
this.templateOpen(message.details);
|
||||
templateOpen(message.details);
|
||||
});
|
||||
};
|
||||
|
||||
templateOpen (object: any) {
|
||||
const templateOpen = (object: any) => {
|
||||
U.Object.openConfig(object, {
|
||||
onClose: () => $(window).trigger(`updatePreviewObject.${object.id}`)
|
||||
});
|
||||
};
|
||||
|
||||
showTemplates (): boolean {
|
||||
const type = this.getObject();
|
||||
if (!type) {
|
||||
return false;
|
||||
};
|
||||
|
||||
return !U.Object.getLayoutsWithoutTemplates().includes(type.recommendedLayout) && (type.uniqueKey != J.Constant.typeKey.template);
|
||||
};
|
||||
|
||||
isAllowedTemplate (): boolean {
|
||||
const type = this.getObject();
|
||||
|
||||
return type?.isInstalled && this.isAllowedObject() && this.showTemplates();
|
||||
};
|
||||
|
||||
isAllowedObject (): boolean {
|
||||
const type = this.getObject();
|
||||
|
||||
const isAllowedObject = (): boolean => {
|
||||
if (!type || !type.isInstalled) {
|
||||
return false;
|
||||
};
|
||||
|
|
@ -335,20 +127,15 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
return ret;
|
||||
};
|
||||
|
||||
onCreate () {
|
||||
const type = this.getObject();
|
||||
if (!type) {
|
||||
return;
|
||||
};
|
||||
|
||||
const onCreate = () => {
|
||||
if (U.Object.isBookmarkLayout(type.recommendedLayout)) {
|
||||
this.onBookmarkAdd();
|
||||
onBookmarkAdd();
|
||||
} else {
|
||||
this.onObjectAdd();
|
||||
onObjectAdd();
|
||||
};
|
||||
};
|
||||
|
||||
onMore () {
|
||||
const onMore = () => {
|
||||
const options = [
|
||||
{ id: 'set', name: translate('pageMainTypeNewSetOfObjects') }
|
||||
];
|
||||
|
|
@ -363,7 +150,7 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
switch (item.id) {
|
||||
|
||||
case 'set':
|
||||
this.onSetAdd();
|
||||
onSetAdd();
|
||||
break;
|
||||
};
|
||||
},
|
||||
|
|
@ -371,19 +158,11 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
});
|
||||
};
|
||||
|
||||
onEdit () {
|
||||
const { isPopup } = this.props;
|
||||
const rootId = this.getRootId();
|
||||
|
||||
const onEdit = () => {
|
||||
sidebar.rightPanelToggle(true, isPopup, 'type', { rootId });
|
||||
};
|
||||
|
||||
onObjectAdd () {
|
||||
const type = this.getObject();
|
||||
if (!type) {
|
||||
return;
|
||||
};
|
||||
|
||||
const onObjectAdd = () => {
|
||||
const details: any = {};
|
||||
|
||||
if (U.Object.isInSetLayouts(type.recommendedLayout)) {
|
||||
|
|
@ -402,7 +181,7 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
});
|
||||
};
|
||||
|
||||
onBookmarkAdd () {
|
||||
const onBookmarkAdd = () => {
|
||||
S.Menu.open('dataviewCreateBookmark', {
|
||||
type: I.MenuType.Horizontal,
|
||||
element: `#button-create`,
|
||||
|
|
@ -413,12 +192,7 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
});
|
||||
};
|
||||
|
||||
onSetAdd () {
|
||||
const type = this.getObject();
|
||||
if (!type) {
|
||||
return;
|
||||
};
|
||||
|
||||
const onSetAdd = () => {
|
||||
const details = {
|
||||
name: U.Common.sprintf(translate('commonSetName'), type.name),
|
||||
iconEmoji: type.iconEmoji,
|
||||
|
|
@ -432,17 +206,12 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
});
|
||||
};
|
||||
|
||||
onMenu (item: any) {
|
||||
const onMenu = (item: any) => {
|
||||
if (S.Menu.isOpen('dataviewTemplateContext', item.id)) {
|
||||
S.Menu.close('dataviewTemplateContext');
|
||||
return;
|
||||
};
|
||||
|
||||
const type = this.getObject();
|
||||
if (!type) {
|
||||
return;
|
||||
};
|
||||
|
||||
const { defaultTemplateId } = type;
|
||||
const template: any = { id: item.id, typeId: type.id };
|
||||
|
||||
|
|
@ -474,7 +243,7 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
U.Object.setDefaultTemplateId(type.id, template.id);
|
||||
},
|
||||
onDuplicate: (object: any) => {
|
||||
this.templateOpen(object);
|
||||
templateOpen(object);
|
||||
},
|
||||
onArchive: () => {
|
||||
if (template.isDefault) {
|
||||
|
|
@ -486,24 +255,142 @@ const PageMainType = observer(class PageMainType extends React.Component<I.PageC
|
|||
});
|
||||
};
|
||||
|
||||
getRootId () {
|
||||
const { rootId, match } = this.props;
|
||||
return rootId ? rootId : match?.params?.id;
|
||||
const recommended = Relation.getArrayValue(type.recommendedRelations).map(id => S.Record.getRelationById(id)).filter(it => it).map(it => it.relationKey);
|
||||
const allowedObject = isAllowedObject();
|
||||
const isAllowedTemplate = type?.isInstalled && isAllowedObject() && canShowTemplates;
|
||||
const templates = S.Record.getRecordIds(subIdTemplate, '');
|
||||
const totalObject = S.Record.getMeta(subIdObject, '').total;
|
||||
const totalTemplate = templates.length + (isAllowedTemplate ? 1 : 0);
|
||||
const isFileType = U.Object.isInFileLayouts(type.recommendedLayout);
|
||||
const columns: any[] = [
|
||||
{
|
||||
relationKey: 'lastModifiedDate', name: translate('commonUpdated'),
|
||||
mapper: v => v ? U.Date.dateWithFormat(S.Common.dateFormat, v) : '',
|
||||
},
|
||||
];
|
||||
|
||||
if (!isFileType) {
|
||||
columns.push({ relationKey: 'creator', name: translate('commonOwner'), isObject: true });
|
||||
};
|
||||
|
||||
getObject () {
|
||||
const rootId = this.getRootId();
|
||||
return S.Detail.get(rootId, rootId, U.Data.typeRelationKeys());
|
||||
useEffect(() => {
|
||||
return () => close();
|
||||
}, []);
|
||||
|
||||
useEffect(() => open());
|
||||
|
||||
let content = null;
|
||||
if (type.isDeleted) {
|
||||
content = <Deleted {...props} />;
|
||||
} else {
|
||||
content = (
|
||||
<div>
|
||||
<Header
|
||||
{...props}
|
||||
component="mainObject"
|
||||
ref={headerRef}
|
||||
rootId={rootId}
|
||||
/>
|
||||
|
||||
{isLoading ? <Loader id="loader" /> : ''}
|
||||
|
||||
<div className="blocks wrapper">
|
||||
<HeadSimple
|
||||
{...props}
|
||||
ref={headRef}
|
||||
placeholder={translate('defaultNameType')}
|
||||
rootId={rootId}
|
||||
onEdit={onEdit}
|
||||
/>
|
||||
|
||||
{canShowTemplates ? (
|
||||
<div className="section template">
|
||||
<div className="title">
|
||||
<div className="side left">
|
||||
{U.Common.plural(totalTemplate, translate('pluralTemplate'))}
|
||||
<span className="cnt">{totalTemplate}</span>
|
||||
</div>
|
||||
|
||||
<div className="side right">
|
||||
{isAllowedTemplate ? (
|
||||
<Icon
|
||||
className="plus withBackground"
|
||||
tooltip={translate('commonCreateNewTemplate')}
|
||||
onClick={onTemplateAdd}
|
||||
/>
|
||||
) : ''}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{totalTemplate ? (
|
||||
<div className="content">
|
||||
<ListObjectPreview
|
||||
key="listTemplate"
|
||||
getItems={() => S.Record.getRecords(subIdTemplate, [])}
|
||||
canAdd={isAllowedTemplate}
|
||||
onAdd={onTemplateAdd}
|
||||
onMenu={isAllowedTemplate ? (e: any, item: any) => onMenu(item) : null}
|
||||
onClick={(e: any, item: any) => templateOpen(item)}
|
||||
withBlank={true}
|
||||
blankId={J.Constant.templateId.blank}
|
||||
defaultId={type.defaultTemplateId || J.Constant.templateId.blank}
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
<div className="empty">
|
||||
{translate('pageMainTypeNoTemplates')}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
) : ''}
|
||||
|
||||
{type.isInstalled ? (
|
||||
<div className="section set">
|
||||
<div className="title">
|
||||
<div className="side left">
|
||||
{U.Common.plural(totalObject, translate('pluralObject'))}
|
||||
<span className="cnt">{totalObject}</span>
|
||||
</div>
|
||||
|
||||
<div className="side right">
|
||||
<Icon
|
||||
id="button-create"
|
||||
className="more withBackground"
|
||||
onClick={onMore}
|
||||
/>
|
||||
|
||||
{allowedObject ? (
|
||||
<Icon
|
||||
className="plus withBackground"
|
||||
tooltip={translate('commonCreateNewObject')}
|
||||
onClick={onCreate}
|
||||
/>
|
||||
) : ''}
|
||||
</div>
|
||||
</div>
|
||||
<div className="content">
|
||||
<ListObject
|
||||
{...props}
|
||||
sources={[ rootId ]}
|
||||
spaceId={type.spaceId}
|
||||
subId={subIdObject}
|
||||
rootId={rootId}
|
||||
columns={columns}
|
||||
relationKeys={recommended}
|
||||
route={analytics.route.screenType}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
) : ''}
|
||||
</div>
|
||||
|
||||
<Footer component="mainObject" {...props} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
getSubIdTemplate () {
|
||||
return S.Record.getSubId(this.getRootId(), 'templates');
|
||||
};
|
||||
return content;
|
||||
|
||||
getSubIdObject () {
|
||||
return S.Record.getSubId(this.getRootId(), 'data');
|
||||
};
|
||||
}));
|
||||
|
||||
});
|
||||
|
||||
export default PageMainType;
|
||||
export default PageMainType;
|
||||
|
|
@ -580,10 +580,9 @@ const PopupSearch = observer(class PopupSearch extends React.Component<I.Popup,
|
|||
const { space } = S.Common;
|
||||
const { backlink } = this.state;
|
||||
const filter = this.filter;
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const filters: any[] = [
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.NotIn, value: U.Object.getSystemLayouts() },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: templateType?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template },
|
||||
];
|
||||
const sorts = [
|
||||
{ relationKey: 'lastOpenedDate', type: I.SortType.Desc },
|
||||
|
|
|
|||
|
|
@ -314,7 +314,6 @@ const SidebarPageObject = observer(class SidebarPageObject extends React.Compone
|
|||
|
||||
load (clear: boolean, callBack?: (message: any) => void) {
|
||||
const option = this.getSortOption();
|
||||
const template = S.Record.getTemplateType();
|
||||
const limit = this.offset + J.Constant.limit.menuRecords;
|
||||
const fileLayouts = [ I.ObjectLayout.File, I.ObjectLayout.Pdf ];
|
||||
const options = U.Menu.getObjectContainerSortOptions(this.type, this.sortId, this.sortType, this.orphan, this.compact);
|
||||
|
|
@ -322,7 +321,7 @@ const SidebarPageObject = observer(class SidebarPageObject extends React.Compone
|
|||
let sorts: I.Sort[] = [];
|
||||
let filters: I.Filter[] = [
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.NotEqual, value: I.ObjectLayout.Participant },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: template?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template },
|
||||
];
|
||||
|
||||
if (option) {
|
||||
|
|
|
|||
|
|
@ -243,7 +243,7 @@ const SidebarPageWidget = observer(class SidebarPageWidget extends React.Compone
|
|||
route: analytics.route.addWidget,
|
||||
filters: [
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.NotIn, value: U.Object.getSystemLayouts() },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: S.Record.getTemplateType()?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template },
|
||||
],
|
||||
canAdd: true,
|
||||
dataChange: (context: any, items: any[]) => {
|
||||
|
|
|
|||
|
|
@ -586,11 +586,10 @@ const WidgetIndex = observer(class WidgetIndex extends React.Component<Props> {
|
|||
|
||||
const { targetBlockId } = child.content;
|
||||
const space = U.Space.getSpaceview();
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const sorts = [];
|
||||
const filters: I.Filter[] = [
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.NotIn, value: U.Object.getFileAndSystemLayouts() },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: templateType?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template },
|
||||
];
|
||||
let limit = this.getLimit(block.content);
|
||||
|
||||
|
|
|
|||
|
|
@ -563,9 +563,8 @@ class UtilData {
|
|||
};
|
||||
|
||||
getTemplatesByTypeId (typeId: string, callBack: (message: any) => void) {
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const filters: I.Filter[] = [
|
||||
{ relationKey: 'type', condition: I.FilterCondition.Equal, value: templateType?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.Equal, value: J.Constant.typeKey.template },
|
||||
{ relationKey: 'targetObjectType', condition: I.FilterCondition.In, value: typeId },
|
||||
];
|
||||
const sorts = [
|
||||
|
|
@ -1012,20 +1011,15 @@ class UtilData {
|
|||
};
|
||||
|
||||
graphFilters () {
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const filters: any[] = [
|
||||
return [
|
||||
{ relationKey: 'isHidden', condition: I.FilterCondition.NotEqual, value: true },
|
||||
{ relationKey: 'isHiddenDiscovery', condition: I.FilterCondition.NotEqual, value: true },
|
||||
{ relationKey: 'isArchived', condition: I.FilterCondition.NotEqual, value: true },
|
||||
{ relationKey: 'isDeleted', condition: I.FilterCondition.NotEqual, value: true },
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.NotIn, value: U.Object.getFileAndSystemLayouts() },
|
||||
{ relationKey: 'id', condition: I.FilterCondition.NotEqual, value: J.Constant.anytypeProfileId },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template }
|
||||
];
|
||||
|
||||
if (templateType) {
|
||||
filters.push({ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: templateType.id });
|
||||
};
|
||||
return filters;
|
||||
};
|
||||
|
||||
moveToPage (rootId: string, ids: string[], typeId: string, route: string) {
|
||||
|
|
|
|||
|
|
@ -560,7 +560,6 @@ class UtilMenu {
|
|||
dashboardSelect (element: string, openRoute?: boolean) {
|
||||
const { space } = S.Common;
|
||||
const { spaceview } = S.Block;
|
||||
const templateType = S.Record.getTemplateType();
|
||||
const subIds = [ 'searchObject' ];
|
||||
|
||||
const onSelect = (object: any, update: boolean) => {
|
||||
|
|
@ -620,7 +619,7 @@ class UtilMenu {
|
|||
data: {
|
||||
filters: [
|
||||
{ relationKey: 'layout', condition: I.FilterCondition.NotIn, value: U.Object.getFileAndSystemLayouts() },
|
||||
{ relationKey: 'type', condition: I.FilterCondition.NotEqual, value: templateType?.id },
|
||||
{ relationKey: 'type.uniqueKey', condition: I.FilterCondition.NotEqual, value: J.Constant.typeKey.template },
|
||||
],
|
||||
canAdd: true,
|
||||
onSelect: el => {
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue