Remove 6 new files
This commit is contained in:
Romaric Mourgues
@@ -1,54 +0,0 @@
|
||||
/* eslint-disable react/prop-types */
|
||||
import React, { Component } from 'react';
|
||||
|
||||
import Languages from '@features/global/services/languages-service';
|
||||
import './input-with-button.scss';
|
||||
import Icon from '@components/icon/icon.jsx';
|
||||
import Input from './input.jsx';
|
||||
|
||||
export default class InputWithButton extends Component {
|
||||
/*
|
||||
props = {
|
||||
value : "",
|
||||
disabled : true|false
|
||||
}
|
||||
*/
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.props = props;
|
||||
|
||||
this.state = {
|
||||
i18n: Languages,
|
||||
};
|
||||
|
||||
Languages.addListener(this);
|
||||
this.inputElement = false;
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
Languages.removeListener(this);
|
||||
}
|
||||
|
||||
render() {
|
||||
return (
|
||||
<div className="inputWithButton">
|
||||
<Input
|
||||
className="medium full_width"
|
||||
refInput={obj => {
|
||||
this.inputElement = obj;
|
||||
this.props.refInput && this.props.refInput();
|
||||
}}
|
||||
{...this.props}
|
||||
/>
|
||||
{!this.props.hideBtn && (
|
||||
<div
|
||||
className={'button button-icon ' + (this.props.color ? this.props.color : '')}
|
||||
onClick={() => this.props.btnAction()}
|
||||
>
|
||||
<Icon type={this.props.icon} />
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,29 +0,0 @@
|
||||
.inputWithButton {
|
||||
display: flex;
|
||||
position: relative;
|
||||
input.input {
|
||||
padding-right: 50px;
|
||||
}
|
||||
.button-icon {
|
||||
position: absolute;
|
||||
height: 40px;
|
||||
right: 0px;
|
||||
box-sizing: border-box;
|
||||
padding: 10px;
|
||||
border-radius: 0px 4px 4px 0px;
|
||||
border-left: solid 1px var(--grey-light);
|
||||
font-size: 16px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.danger {
|
||||
background-color: var(--grey-background);
|
||||
color: var(--grey-dark);
|
||||
}
|
||||
|
||||
.danger:hover {
|
||||
transition: 0.5s;
|
||||
background-color: var(--grey-light);
|
||||
color: var(--red);
|
||||
}
|
||||
}
|
||||
@@ -1,87 +0,0 @@
|
||||
import React, { Component } from 'react';
|
||||
|
||||
import Number from '@features/global/utils/Numbers';
|
||||
import AttributesManager from './attributes-manager.js';
|
||||
import './parameters.scss';
|
||||
import Languages from '@features/global/services/languages-service';
|
||||
|
||||
export default class Attribute extends React.Component {
|
||||
constructor(props) {
|
||||
super();
|
||||
|
||||
this.id = Number.unid();
|
||||
|
||||
this.state = {
|
||||
parameters_attributes: AttributesManager,
|
||||
i18n: Languages,
|
||||
};
|
||||
|
||||
this.timeout = setTimeout('');
|
||||
|
||||
Languages.addListener(this);
|
||||
AttributesManager.addListener(this);
|
||||
}
|
||||
componentDidMount() {
|
||||
if (this.props.autoOpen) {
|
||||
AttributesManager.toggle(this.id);
|
||||
}
|
||||
}
|
||||
componentWillUnmount() {
|
||||
clearTimeout(this.timeout);
|
||||
Languages.removeListener(this);
|
||||
AttributesManager.removeListener(this);
|
||||
}
|
||||
componentDidUpdate() {
|
||||
var open = this.state.parameters_attributes.open == this.id;
|
||||
if (open && !this.was_open) {
|
||||
this.value_node.style.maxHeight = 'none';
|
||||
this.value_height = window.getBoundingClientRect(this.value_node).height;
|
||||
this.value_node.style.maxHeight = '0px';
|
||||
clearTimeout(this.timeout);
|
||||
this.timeout = setTimeout(() => {
|
||||
this.value_node.style.maxHeight = this.value_height + 'px';
|
||||
|
||||
this.timeout = setTimeout(() => {
|
||||
this.value_node.style.maxHeight = 'none';
|
||||
this.value_height = window.getBoundingClientRect(this.value_node).height;
|
||||
}, 200);
|
||||
}, 50);
|
||||
|
||||
if (this.props.focusOnOpen) {
|
||||
this.props.focusOnOpen.focus();
|
||||
}
|
||||
} else if (!open && this.was_open) {
|
||||
clearTimeout(this.timeout);
|
||||
|
||||
this.value_node.style.maxHeight = this.value_height + 'px';
|
||||
this.timeout = setTimeout(() => {
|
||||
this.value_node.style.maxHeight = '0px';
|
||||
}, 50);
|
||||
}
|
||||
this.was_open = open;
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div
|
||||
className={
|
||||
'parameters_attribute ' + (this.state.parameters_attributes.open == this.id ? 'open' : '')
|
||||
}
|
||||
>
|
||||
<div className="label" onClick={() => AttributesManager.toggle(this.id)}>
|
||||
{!this.props.autoOpen && (
|
||||
<a href="#" className="modify">
|
||||
{this.state.parameters_attributes.open == this.id
|
||||
? this.state.i18n.t('general.close')
|
||||
: this.state.i18n.t('general.open')}
|
||||
</a>
|
||||
)}
|
||||
<div className="label">{this.props.label}</div>
|
||||
<div className="description">{this.props.description}</div>
|
||||
</div>
|
||||
<div ref={node => (this.value_node = node)} className="value">
|
||||
{this.props.children}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,14 @@
|
||||
import { ReactNode } from 'react';
|
||||
import './parameters.scss';
|
||||
|
||||
export default (props: { label: string; description: string; children: ReactNode }) => {
|
||||
return (
|
||||
<div className={'parameters_attribute open'}>
|
||||
<div className="label">
|
||||
<div className="label">{props.label}</div>
|
||||
<div className="description">{props.description}</div>
|
||||
</div>
|
||||
<div className="value">{props.children}</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@@ -1,26 +0,0 @@
|
||||
import React, { Component } from 'react';
|
||||
|
||||
import Observable from '@deprecated/CollectionsV1/observable.js';
|
||||
|
||||
/*
|
||||
Menus manager service, choose where to generate menu
|
||||
*/
|
||||
class AttributesManager extends Observable {
|
||||
constructor() {
|
||||
super();
|
||||
this.setObservableName('parameters_attributes');
|
||||
|
||||
this.open = '';
|
||||
}
|
||||
toggle(id) {
|
||||
if (this.open == id) {
|
||||
this.open = '';
|
||||
} else {
|
||||
this.open = id;
|
||||
}
|
||||
this.notify();
|
||||
}
|
||||
}
|
||||
|
||||
const service = new AttributesManager();
|
||||
export default service;
|
||||
@@ -1,113 +0,0 @@
|
||||
import React, { Component } from 'react';
|
||||
|
||||
import './tooltip.scss';
|
||||
|
||||
export default class Tooltip extends Component {
|
||||
/*
|
||||
props = {
|
||||
tooltip : text or react element to show
|
||||
visible :
|
||||
overable : default : true
|
||||
position :
|
||||
}
|
||||
*/
|
||||
constructor(props) {
|
||||
super(props);
|
||||
this.state = {
|
||||
top: 'unset',
|
||||
left: 'unset',
|
||||
right: 'unset',
|
||||
bottom: '0px',
|
||||
};
|
||||
}
|
||||
componentWillUnmount() {}
|
||||
componentDidUpdate(prevProps, prevState) {
|
||||
if (this.props.visible === true && prevProps.visible === false) {
|
||||
this.open();
|
||||
} else if (this.props.visible === false && prevProps.visible === true) {
|
||||
this.close();
|
||||
}
|
||||
}
|
||||
openWithTimeOut(timeout = 5) {
|
||||
var that = this;
|
||||
that.open();
|
||||
setTimeout(() => {
|
||||
that.close();
|
||||
}, timeout * 1000);
|
||||
}
|
||||
open() {
|
||||
if (this.props.position === 'left') {
|
||||
this.setState({
|
||||
visible: true,
|
||||
left: (this.tooltip.clientWidth + 8) * -1 + 'px',
|
||||
right: 'unset',
|
||||
});
|
||||
} else if (this.props.position === 'right') {
|
||||
this.setState({
|
||||
visible: true,
|
||||
right: (this.tooltip.clientWidth + 8) * -1 + 'px',
|
||||
left: 'unset',
|
||||
});
|
||||
} else if (this.props.position === 'bottom') {
|
||||
this.setState({
|
||||
visible: true,
|
||||
bottom: (this.tooltip.clientHeight + 5) * -1 + 'px',
|
||||
top: 'unset',
|
||||
});
|
||||
} else {
|
||||
this.setState({
|
||||
visible: true,
|
||||
top: (this.tooltip.clientHeight + 5) * -1 + 'px',
|
||||
bottom: 'unset',
|
||||
});
|
||||
}
|
||||
}
|
||||
close() {
|
||||
this.setState({ visible: false, top: 'unset', left: '0px', right: 'unset', bottom: '0px' });
|
||||
}
|
||||
componentDidMount() {
|
||||
var that = this;
|
||||
if (this.parent && this.children) {
|
||||
window.tooltip = this.tooltip;
|
||||
this.parent.addEventListener('mouseenter', () => {
|
||||
if (this.props.overable !== false) {
|
||||
that.open();
|
||||
}
|
||||
});
|
||||
this.parent.addEventListener('mouseleave', () => {
|
||||
if (this.props.overable !== false) {
|
||||
that.close();
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
render() {
|
||||
return (
|
||||
<div
|
||||
className={'tooltip ' + (this.props.className || '')}
|
||||
ref={parent => (this.parent = parent)}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
top: this.state.top,
|
||||
left: this.state.left,
|
||||
bottom: this.state.bottom,
|
||||
right: this.state.right,
|
||||
}}
|
||||
className={
|
||||
'tooltipAbsolute ' +
|
||||
(this.state.visible ? 'visible' : '') +
|
||||
' ' +
|
||||
(this.props.position ? this.props.position : 'top')
|
||||
}
|
||||
ref={obj => (this.tooltip = obj)}
|
||||
>
|
||||
{this.props.tooltip}
|
||||
</div>
|
||||
<div className="contentTooltip" ref={children => (this.children = children)}>
|
||||
{this.props.children}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,68 +0,0 @@
|
||||
.tooltip {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
.tooltipAbsolute {
|
||||
position: absolute;
|
||||
opacity: 0;
|
||||
z-index: -1;
|
||||
background: black;
|
||||
color: white;
|
||||
border-bottom: 1px dotted black;
|
||||
padding: 5px 10px;
|
||||
border-radius: var(--border-radius-base);
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
line-height: 16px;
|
||||
}
|
||||
.tooltipAbsolute::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
border-width: 5px;
|
||||
border-style: solid;
|
||||
}
|
||||
.right,
|
||||
.left {
|
||||
top: 50% !important;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
.top,
|
||||
.bottom {
|
||||
left: 50% !important;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
.top::after {
|
||||
left: calc(50% - 5px);
|
||||
top: 100%;
|
||||
border-color: black transparent transparent transparent;
|
||||
}
|
||||
.right::after {
|
||||
left: -10px;
|
||||
border-color: transparent black transparent transparent;
|
||||
top: calc(50% - 5px);
|
||||
margin-top: -5px;
|
||||
}
|
||||
.bottom::after {
|
||||
bottom: 100%;
|
||||
border-color: transparent transparent black transparent;
|
||||
left: calc(50% - 5px);
|
||||
margin-left: -5px;
|
||||
}
|
||||
.left::after {
|
||||
right: -10px;
|
||||
border-color: transparent transparent transparent black;
|
||||
top: calc(50% - 5px);
|
||||
margin-top: -5px;
|
||||
}
|
||||
.visible {
|
||||
z-index: 50;
|
||||
opacity: 1;
|
||||
transition: opacity 0.2s;
|
||||
}
|
||||
.contentTooltip {
|
||||
width: 100%;
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
@@ -2,7 +2,7 @@
|
||||
import classNames from 'classnames';
|
||||
import React, { Suspense, useState } from 'react';
|
||||
|
||||
import ChatUploadsViewer from '@components/file-uploads/uploads-viewer';
|
||||
import UploadsViewer from '@components/file-uploads/uploads-viewer';
|
||||
import { useFeatureToggles } from '@components/locked-features-components/feature-toggles-hooks';
|
||||
import MenusBodyLayer from '@components/menus/menus-body-layer.jsx';
|
||||
import ModalComponent from '@components/modal/modal-component';
|
||||
@@ -16,7 +16,6 @@ import ConnectionIndicator from 'components/connection-indicator/connection-indi
|
||||
import NewVersionComponent from 'components/new-version/new-version-component';
|
||||
import PopupComponent from 'components/popup-component/popup-component.jsx';
|
||||
import SearchPopup from 'components/search-popup/search-popup';
|
||||
import DriveUploadViewer from 'components/uploads/upload-viewer.jsx';
|
||||
import MainView from './body';
|
||||
|
||||
import DownloadAppBanner from '@components/download-app-banner/download-app-banner';
|
||||
@@ -94,12 +93,11 @@ export default React.memo((): JSX.Element => {
|
||||
{PopupService.isOpen() && <PopupComponent key="PopupComponent" />}
|
||||
{page}
|
||||
<MenusBodyLayer />
|
||||
<DriveUploadViewer />
|
||||
<Viewer />
|
||||
<ModalComponent />
|
||||
<SearchPopup />
|
||||
<ConnectionIndicator />
|
||||
<ChatUploadsViewer />
|
||||
<UploadsViewer />
|
||||
</>
|
||||
);
|
||||
});
|
||||
|
||||
@@ -6,7 +6,6 @@ import { getFilesTree } from '@components/uploads/file-tree-utils';
|
||||
import Collections from '@deprecated/CollectionsV1/Collections/Collections.js';
|
||||
import popupManager from '@deprecated/popupManager/popupManager.js';
|
||||
import currentUserService from '@deprecated/user/CurrentUser';
|
||||
import workspaceService from '@deprecated/workspaces/workspaces.jsx';
|
||||
import LoginService from '@features/auth/login-service';
|
||||
import InitService from '@features/global/services/init-service';
|
||||
import Languages from '@features/global/services/languages-service';
|
||||
@@ -15,7 +14,7 @@ import { ExternalLinkIcon } from '@heroicons/react/outline';
|
||||
import ButtonWithTimeout from 'components/buttons/button-with-timeout.jsx';
|
||||
import Input from 'components/inputs/input.jsx';
|
||||
import MenuList from 'components/menus/menu-component.jsx';
|
||||
import Attribute from 'components/parameters/attribute.jsx';
|
||||
import Attribute from 'components/parameters/attribute.tsx';
|
||||
import { Button } from '../../../../atoms/button/button';
|
||||
import * as Text from '../../../../atoms/text';
|
||||
import './UserParameter.scss';
|
||||
|
||||
Reference in New Issue
Block a user