this.node = node} className={cn.join(' ')}>
@@ -131,7 +143,16 @@ const HeadSimple = observer(class Controls extends React.Component
{
canEdit={canEditIcon}
/>
) : ''}
-
+
+
+ {withColorPicker ? (
+
+ ) : ''}
{descr}
@@ -285,6 +306,27 @@ const HeadSimple = observer(class Controls extends React.Component
{
return sources.includes(rootId);
};
+ onColorPicker () {
+ const { rootId, onColorChange, colorPickerTitle } = this.props;
+ const object = S.Detail.get(rootId, rootId);
+
+ S.Menu.open('dataviewOptionEdit', {
+ element: `#colorPicker`,
+ offsetY: 4,
+ title: colorPickerTitle || translate('commonColor'),
+ data: {
+ option: { color: object.color },
+ onColorPick: (color) => {
+ if (onColorChange) {
+ onColorChange(color);
+ };
+ },
+ noFilter: true,
+ noRemove: true
+ }
+ });
+ };
+
});
-export default HeadSimple;
\ No newline at end of file
+export default HeadSimple;
diff --git a/src/ts/component/page/index.tsx b/src/ts/component/page/index.tsx
index 24d16bdb3c..6e2fef6079 100644
--- a/src/ts/component/page/index.tsx
+++ b/src/ts/component/page/index.tsx
@@ -31,6 +31,9 @@ import PageMainMembership from './main/membership';
import PageMainObject from './main/object';
import PageMainOnboarding from './main/onboarding';
import PageMainChat from './main/chat';
+import PageMainTag from './main/tag';
+import PageMainDate from './main/date';
+import { createRef } from 'react';
const Components = {
'index/index': PageAuthSelect,
@@ -61,12 +64,12 @@ const Components = {
'main/onboarding': PageMainOnboarding,
'main/chat': PageMainChat,
'main/void': PageMainVoid,
-};
-
+ 'main/date': PageMainDate,
+} as const;
const Page = observer(class Page extends React.Component {
_isMounted = false;
- refChild: any = null;
+ refChild: React.RefObject = createRef();
frame = 0;
render () {
@@ -98,7 +101,7 @@ const Page = observer(class Page extends React.Component {
const wrap = (
- this.refChild = ref} {...this.props} />
+
);
@@ -353,8 +356,8 @@ const Page = observer(class Page extends React.Component {
return;
};
- if (this.refChild && this.refChild.resize) {
- this.refChild.resize();
+ if (this.refChild.current && this.refChild.current.resize) {
+ this.refChild.current.resize();
};
sidebar.resizePage(null, false);
diff --git a/src/ts/component/page/main/date/index.tsx b/src/ts/component/page/main/date/index.tsx
new file mode 100644
index 0000000000..3a8f17dcae
--- /dev/null
+++ b/src/ts/component/page/main/date/index.tsx
@@ -0,0 +1,333 @@
+import * as React from 'react';
+import { observer } from 'mobx-react';
+import { Action, C, I, J, Renderer, S, translate, U } from 'Lib';
+import { Header, Footer, ListObject, Button } from 'Component';
+import HeadSimple from 'Component/page/elements/head/simple';
+import RelationsSelector from './relations';
+import { useParams } from 'react-router-dom';
+import { useEffect, useRef, useState } from 'react';
+import { set } from 'lodash';
+import { number, unknown } from '@rspack/core/compiled/zod';
+import { then } from 'Lib/util/then';
+
+interface State {
+ isLoading: boolean;
+ isDeleted: boolean;
+ relationKeyWithCounterList: { relationKey: string, counter: number }[];
+};
+
+// const PageMainDate = observer(class PageMainDate extends React.Component {
+
+// _isMounted = false;
+// node: any = null;
+// id = '';
+// refHeader: any = null;
+// refHead: any = null;
+
+// state = {
+// isLoading: false,
+// isDeleted: false,
+// relationKeyWithCounterList: [],
+// };
+
+// render() {
+// const rootId = this.getRootId();
+// const object = S.Detail.get(rootId, rootId, ['backlinks']);
+
+// const subId = this.getSubId();
+// const total = S.Record.getMeta(subId, '').total;
+
+// const filters: I.Filter[] = [{ relationKey: 'id', condition: I.FilterCondition.In, value: object.backlinks || [] }];
+
+// const columns: any[] = [
+// { relationKey: 'type', name: translate('commonObjectType'), isObject: true },
+// { relationKey: 'creator', name: translate('commonOwner'), isObject: true },
+// ];
+
+// return (
+// this.node = node}>
+//
+//
this.refHead = ref}
+// placeholder={translate('defaultNameTag')}
+// rootId={rootId}
+// isContextMenuDisabled={true}
+// noIcon={true}
+// withColorPicker={false}
+// />
+//
+// {!object._empty_ ? (
+//
+//
{total} {U.Common.plural(total, translate('pluralObject'))}
+//
+//
+//
+//
+
+//
+//
+
+
+
+ {!object._empty_ ? (
+
+
{total} {U.Common.plural(total, translate('pluralObject'))}
+
+
+
+
+ ) : ''}
+
+
+
+
console.log(relation)}
+ >
+ {relation.name || translate('defaultNamePage')}
+
+ );
+});
+
+const RelationsContainer = SortableContainer(({ relations, rootId }: { relations: RelationWithCounter[], rootId: string }) => (
+
+ {relations.map((relation, i: number) => (
+
+ ))}
+
+));
+
+const RelationsSelector: React.FC = (props: RelationsSelectorProps) => {
+
+ const [relations, setRelations] = React.useState([]);
+
+ const { rootId, className } = props;
+
+ const cn: string[] = ['dateRelations'];
+ if (className) {
+ cn.push(className);
+ };
+
+ useEffect(() => {
+ C.RelationListWithValue(U.Router.getRouteSpaceId(), rootId, (message: any) => {
+ const { error } = message;
+ if (error) {
+ return;
+ };
+ const object = S.Detail.get(rootId, U.Router.getRouteSpaceId());
+ console.log('Object:', object);
+ const { countersList, relationskeysList } = message;
+ const relationKeyWithCounterList = relationskeysList.map((relationKey: string, ndx: number) => {
+ return {
+ relationkey: relationKey,
+ counter: countersList[ndx],
+ };
+ });
+ console.log('RelationKeyWithCounterList:', relationKeyWithCounterList);
+ setRelations(relationKeyWithCounterList);
+ });
+ }, [rootId]);
+
+ return (
+
+ );
+};
+
+export default RelationsSelector;
diff --git a/src/ts/component/page/main/object.tsx b/src/ts/component/page/main/object.tsx
index cfefda4725..4eb93032a9 100644
--- a/src/ts/component/page/main/object.tsx
+++ b/src/ts/component/page/main/object.tsx
@@ -31,4 +31,4 @@ class PageMainObject extends React.Component {
};
-export default PageMainObject;
\ No newline at end of file
+export default PageMainObject;
diff --git a/src/ts/component/page/main/tag.tsx b/src/ts/component/page/main/tag.tsx
new file mode 100644
index 0000000000..6beb87d82b
--- /dev/null
+++ b/src/ts/component/page/main/tag.tsx
@@ -0,0 +1,182 @@
+import * as React from 'react';
+import { observer } from 'mobx-react';
+import { Action, C, I, S, translate, U } from 'Lib';
+import { Header, Footer, ListObject } from 'Component';
+import HeadSimple from 'Component/page/elements/head/simple';
+
+interface State {
+ isLoading: boolean;
+ isDeleted: boolean;
+};
+
+const PageMainTag = observer(class PageMainTag extends React.Component {
+
+ _isMounted = false;
+ node: any = null;
+ id = '';
+ refHeader: any = null;
+ refHead: any = null;
+
+ state = {
+ isLoading: false,
+ isDeleted: false,
+ };
+
+ constructor (props: I.PageComponent) {
+ super(props);
+
+ this.setColor = this.setColor.bind(this);
+ };
+
+ render () {
+ const rootId = this.getRootId();
+ const object = S.Detail.get(rootId, rootId, [ 'backlinks' ]);
+
+ const subId = this.getSubId();
+ const total = S.Record.getMeta(subId, '').total;
+
+ const filters: I.Filter[] = [ { relationKey: 'id', condition: I.FilterCondition.In, value: object.backlinks || [] } ];
+
+ const columns: any[] = [
+ { relationKey: 'type', name: translate('commonObjectType'), isObject: true },
+ {
+ relationKey: 'createdDate', name: translate('commonDateCreated'),
+ mapper: v => v ? U.Date.dateWithFormat(I.DateFormat.MonthAbbrBeforeDay, v) : '',
+ },
+ { relationKey: 'creator', name: translate('commonOwner'), isObject: true },
+ ];
+
+ return (
+ this.node = node}>
+
this.refHeader = ref}
+ rootId={rootId}
+ />
+
+
+
this.refHead = ref}
+ placeholder={translate('defaultNameTag')}
+ rootId={rootId}
+ isContextMenuDisabled={true}
+ noIcon={true}
+ withColorPicker={true}
+ onColorChange={this.setColor}
+ colorPickerTitle={translate('pageMainTagTagColor')}
+ />
+
+ {!object._empty_ ? (
+
+
{total} {U.Common.plural(total, translate('pluralObject'))}
+
+
+
+