diff --git a/packages/web/src/DragAndDropFileTarget.js b/packages/web/src/DragAndDropFileTarget.js index 85ece2ec1..334eedbae 100644 --- a/packages/web/src/DragAndDropFileTarget.js +++ b/packages/web/src/DragAndDropFileTarget.js @@ -11,7 +11,7 @@ const TargetStyled = styled.div` left: 0; right: 0; bottom: 0; - background: ${(props) => props.theme.main_background_blue[3]}; + background: ${props => props.theme.main_background_blue[3]}; align-items: center; justify-content: space-around; z-index: 1000; @@ -52,8 +52,8 @@ export default function DragAndDropFileTarget({ isDragActive, inputProps }) { Supported file types:{' '} {fileFormats - .filter((x) => x.readerFunc) - .map((x) => x.name) + .filter(x => x.readerFunc) + .map(x => x.name) .join(', ')} diff --git a/packages/web/src/Screen.js b/packages/web/src/Screen.js index 54cc90e49..7db822a87 100644 --- a/packages/web/src/Screen.js +++ b/packages/web/src/Screen.js @@ -21,10 +21,10 @@ import ErrorBoundary from './utility/ErrorBoundary'; const BodyDiv = styled.div` position: fixed; top: ${dimensions.tabsPanel.height + dimensions.toolBar.height}px; - left: ${(props) => props.contentLeft}px; + left: ${props => props.contentLeft}px; bottom: ${dimensions.statusBar.height}px; right: 0; - background-color: ${(props) => props.theme.content_background}; + background-color: ${props => props.theme.content_background}; `; const ToolBarDiv = styled.div` @@ -32,7 +32,7 @@ const ToolBarDiv = styled.div` top: 0; left: 0; right: 0; - background-color: ${(props) => props.theme.toolbar_background}; + background-color: ${props => props.theme.toolbar_background}; height: ${dimensions.toolBar.height}px; `; @@ -42,7 +42,7 @@ const IconBar = styled.div` left: 0; bottom: ${dimensions.statusBar.height}px; width: ${dimensions.widgetMenu.iconSize}px; - background-color: ${(props) => props.theme.widget_background}; + background-color: ${props => props.theme.widget_background}; `; const LeftPanel = styled.div` @@ -50,7 +50,7 @@ const LeftPanel = styled.div` top: ${dimensions.toolBar.height}px; left: ${dimensions.widgetMenu.iconSize}px; bottom: ${dimensions.statusBar.height}px; - background-color: ${(props) => props.theme.left_background}; + background-color: ${props => props.theme.left_background}; display: flex; `; @@ -58,11 +58,11 @@ const TabsPanelContainer = styled.div` display: flex; position: fixed; top: ${dimensions.toolBar.height}px; - left: ${(props) => props.contentLeft}px; + left: ${props => props.contentLeft}px; height: ${dimensions.tabsPanel.height}px; right: 0; - background-color: ${(props) => props.theme.tabs_background2}; - border-top: 1px solid ${(props) => props.theme.border}; + background-color: ${props => props.theme.tabs_background2}; + border-top: 1px solid ${props => props.theme.border}; overflow-x: auto; @@ -78,7 +78,7 @@ const StausBarContainer = styled.div` left: 0; right: 0; bottom: 0; - background-color: ${(props) => props.theme.statusbar_background}; + background-color: ${props => props.theme.statusbar_background}; `; const ScreenHorizontalSplitHandle = styled(HorizontalSplitHandle)` @@ -100,7 +100,7 @@ export default function Screen() { ? dimensions.widgetMenu.iconSize + leftPanelWidth + dimensions.splitter.thickness : dimensions.widgetMenu.iconSize; const toolbarPortalRef = React.useRef(); - const onSplitDown = useSplitterDrag('clientX', (diff) => setLeftPanelWidth((v) => v + diff)); + const onSplitDown = useSplitterDrag('clientX', diff => setLeftPanelWidth(v => v + diff)); const { getRootProps, getInputProps, isDragActive } = useUploadsZone(); diff --git a/packages/web/src/TabContent.js b/packages/web/src/TabContent.js index d215ca8c3..779423216 100644 --- a/packages/web/src/TabContent.js +++ b/packages/web/src/TabContent.js @@ -12,7 +12,7 @@ const TabContainerStyled = styled.div` right: 0; bottom: 0; display: flex; - visibility: ${(props) => + visibility: ${props => // @ts-ignore props.tabVisible ? 'visible' : 'hidden'}; `; @@ -52,15 +52,15 @@ export default function TabContent({ toolbarPortalRef }) { _.difference( _.keys(mountedTabs), _.map( - files.filter((x) => x.closedTime == null), + files.filter(x => x.closedTime == null), 'tabid' ) ).length > 0 ) { - setMountedTabs(_.pickBy(mountedTabs, (v, k) => files.find((x) => x.tabid == k && x.closedTime == null))); + setMountedTabs(_.pickBy(mountedTabs, (v, k) => files.find(x => x.tabid == k && x.closedTime == null))); } - const selectedTab = files.find((x) => x.selected); + const selectedTab = files.find(x => x.selected); if (selectedTab) { const { tabid } = selectedTab; if (tabid && !mountedTabs[tabid]) @@ -70,7 +70,7 @@ export default function TabContent({ toolbarPortalRef }) { }); } - return _.keys(mountedTabs).map((tabid) => { + return _.keys(mountedTabs).map(tabid => { const { TabComponent, props } = mountedTabs[tabid]; const tabVisible = tabid == (selectedTab && selectedTab.tabid); return ( diff --git a/packages/web/src/TabsPanel.js b/packages/web/src/TabsPanel.js index c392cc66b..28fddc463 100644 --- a/packages/web/src/TabsPanel.js +++ b/packages/web/src/TabsPanel.js @@ -31,8 +31,8 @@ const DbWrapperHandler = styled.div` const DbNameWrapper = styled.div` text-align: center; font-size: 8pt; - border-bottom: 1px solid ${(props) => props.theme.border}; - border-right: 1px solid ${(props) => props.theme.border}; + border-bottom: 1px solid ${props => props.theme.border}; + border-right: 1px solid ${props => props.theme.border}; cursor: pointer; user-select: none; padding: 1px; @@ -44,9 +44,9 @@ const DbNameWrapper = styled.div` // height: 15px; &:hover { - background-color: ${(props) => props.theme.tabs_background3}; + background-color: ${props => props.theme.tabs_background3}; } - background-color: ${(props) => + background-color: ${props => // @ts-ignore props.selected ? props.theme.tabs_background1 : 'inherit'}; `; @@ -57,7 +57,7 @@ const DbNameWrapper = styled.div` // `; const FileTabItem = styled.div` - border-right: 1px solid ${(props) => props.theme.border}; + border-right: 1px solid ${props => props.theme.border}; padding-left: 15px; padding-right: 15px; flex-shrink: 1; @@ -68,9 +68,9 @@ const FileTabItem = styled.div` cursor: pointer; user-select: none; &:hover { - color: ${(props) => props.theme.tabs_font_hover}; + color: ${props => props.theme.tabs_font_hover}; } - background-color: ${(props) => + background-color: ${props => // @ts-ignore props.selected ? props.theme.tabs_background1 : 'inherit'}; `; @@ -83,7 +83,7 @@ const CloseButton = styled(FontIcon)` margin-left: 5px; color: gray; &:hover { - color: ${(props) => props.theme.tabs_font2}; + color: ${props => props.theme.tabs_font2}; } `; @@ -140,21 +140,21 @@ export default function TabsPanel() { if (e.target.closest('.tabCloseButton')) { return; } - setOpenedTabs((files) => - files.map((x) => ({ + setOpenedTabs(files => + files.map(x => ({ ...x, selected: x.tabid == tabid, })) ); }; - const closeTabFunc = (closeCondition) => (tabid) => { - setOpenedTabs((files) => { - const active = files.find((x) => x.tabid == tabid); + const closeTabFunc = closeCondition => tabid => { + setOpenedTabs(files => { + const active = files.find(x => x.tabid == tabid); if (!active) return files; - const lastSelectedIndex = _.findIndex(files, (x) => x.tabid == tabid); + const lastSelectedIndex = _.findIndex(files, x => x.tabid == tabid); let selectedIndex = lastSelectedIndex; - const newFiles = files.map((x) => ({ + const newFiles = files.map(x => ({ ...x, closedTime: x.closedTime || (closeCondition(x, active) ? new Date().getTime() : undefined), })); @@ -180,8 +180,8 @@ export default function TabsPanel() { const closeTab = closeTabFunc((x, active) => x.tabid == active.tabid); const closeAll = () => { const closedTime = new Date().getTime(); - setOpenedTabs((tabs) => - tabs.map((tab) => ({ + setOpenedTabs(tabs => + tabs.map(tab => ({ ...tab, closedTime: tab.closedTime || closedTime, selected: false, @@ -226,8 +226,8 @@ export default function TabsPanel() { // tabs.map(x => x.tooltip) // ); const tabsWithDb = tabs - .filter((x) => !x.closedTime) - .map((tab) => ({ + .filter(x => !x.closedTime) + .map(tab => ({ ...tab, tabDbName: getTabDbName(tab), tabDbKey: getTabDbKey(tab), @@ -235,7 +235,7 @@ export default function TabsPanel() { const tabsByDb = _.groupBy(tabsWithDb, 'tabDbKey'); const dbKeys = _.keys(tabsByDb).sort(); - const handleSetDb = async (props) => { + const handleSetDb = async props => { const { conid, database } = props || {}; if (conid) { const connection = await getConnectionInfo({ conid, database }); @@ -249,7 +249,7 @@ export default function TabsPanel() { return ( <> - {dbKeys.map((dbKey) => ( + {dbKeys.map(dbKey => ( {tabsByDb[dbKey][0].tabDbName} - {_.sortBy(tabsByDb[dbKey], 'title').map((tab) => ( + {_.sortBy(tabsByDb[dbKey], 'title').map(tab => ( handleTabClick(e, tab.tabid)} - onMouseUp={(e) => handleMouseUp(e, tab.tabid)} - onContextMenu={(e) => handleContextMenu(e, tab.tabid, tab.props)} + onClick={e => handleTabClick(e, tab.tabid)} + onMouseUp={e => handleMouseUp(e, tab.tabid)} + onContextMenu={e => handleContextMenu(e, tab.tabid, tab.props)} > {} {tab.title} @@ -276,7 +276,7 @@ export default function TabsPanel() { icon="icon close" className="tabCloseButton" theme={theme} - onClick={(e) => { + onClick={e => { e.preventDefault(); closeTab(tab.tabid); }} diff --git a/packages/web/src/appobj/AppObjectCore.js b/packages/web/src/appobj/AppObjectCore.js index 0730ee7ac..62c2b429d 100644 --- a/packages/web/src/appobj/AppObjectCore.js +++ b/packages/web/src/appobj/AppObjectCore.js @@ -10,11 +10,11 @@ import useTheme from '../theme/useTheme'; const AppObjectDiv = styled.div` padding: 5px; &:hover { - background-color: ${(props) => props.theme.left_background_blue[1]}; + background-color: ${props => props.theme.left_background_blue[1]}; } cursor: pointer; white-space: nowrap; - font-weight: ${(props) => (props.isBold ? 'bold' : 'normal')}; + font-weight: ${props => (props.isBold ? 'bold' : 'normal')}; `; const IconWrap = styled.span` @@ -28,7 +28,7 @@ const StatusIconWrap = styled.span` const ExtInfoWrap = styled.span` font-weight: normal; margin-left: 5px; - color: ${(props) => props.theme.left_font3}; + color: ${props => props.theme.left_font3}; `; export function AppObjectCore({ @@ -50,7 +50,7 @@ export function AppObjectCore({ const theme = useTheme(); const showMenu = useShowMenu(); - const handleContextMenu = (event) => { + const handleContextMenu = event => { if (!Menu) return; event.preventDefault(); @@ -68,7 +68,7 @@ export function AppObjectCore({ theme={theme} isBold={isBold} draggable - onDragStart={(e) => { + onDragStart={e => { e.dataTransfer.setData('app_object_drag_data', JSON.stringify(data)); }} {...other} diff --git a/packages/web/src/appobj/AppObjectList.js b/packages/web/src/appobj/AppObjectList.js index 455112f40..7883e0b5c 100644 --- a/packages/web/src/appobj/AppObjectList.js +++ b/packages/web/src/appobj/AppObjectList.js @@ -22,7 +22,7 @@ const GroupDiv = styled.div` user-select: none; padding: 5px; &:hover { - background-color: ${(props) => props.theme.left_background_blue[1]}; + background-color: ${props => props.theme.left_background_blue[1]}; } cursor: pointer; white-space: nowrap; @@ -57,7 +57,7 @@ function AppObjectListItem({ }; if (SubItems) { - commonProps.onClick2 = () => setIsExpanded((v) => !v); + commonProps.onClick2 = () => setIsExpanded(v => !v); } if (onObjectClick) { commonProps.onClick3 = onObjectClick; @@ -90,9 +90,9 @@ function AppObjectGroup({ group, items }) { - {group} {items && `(${items.filter((x) => x.component).length})`} + {group} {items && `(${items.filter(x => x.component).length})`} - {isExpanded && items.map((x) => x.component)} + {isExpanded && items.map(x => x.component)} ); } @@ -108,7 +108,7 @@ export function AppObjectList({ isExpandable = undefined, getCommonProps = undefined, }) { - const createComponent = (data) => ( + const createComponent = data => ( { + (list || []).map(data => { const matcher = AppObjectComponent.createMatcher && AppObjectComponent.createMatcher(data); if (matcher && !matcher(filter)) return null; const component = createComponent(data); @@ -132,12 +132,12 @@ export function AppObjectList({ }) ); const groups = _.groupBy(listGrouped, 'group'); - return (groupOrdered || _.keys(groups)).map((group) => ( + return (groupOrdered || _.keys(groups)).map(group => ( )); } - return (list || []).map((data) => { + return (list || []).map(data => { const matcher = AppObjectComponent.createMatcher && AppObjectComponent.createMatcher(data); if (matcher && !matcher(filter)) return null; return createComponent(data); diff --git a/packages/web/src/appobj/ArchiveFileAppObject.js b/packages/web/src/appobj/ArchiveFileAppObject.js index 0782b7c16..3fed3ba7c 100644 --- a/packages/web/src/appobj/ArchiveFileAppObject.js +++ b/packages/web/src/appobj/ArchiveFileAppObject.js @@ -69,7 +69,7 @@ function ArchiveFileAppObject({ data, commonProps }) { ); } -ArchiveFileAppObject.extractKey = (data) => data.fileName; -ArchiveFileAppObject.createMatcher = ({ fileName }) => (filter) => filterName(filter, fileName); +ArchiveFileAppObject.extractKey = data => data.fileName; +ArchiveFileAppObject.createMatcher = ({ fileName }) => filter => filterName(filter, fileName); export default ArchiveFileAppObject; diff --git a/packages/web/src/appobj/ArchiveFolderAppObject.js b/packages/web/src/appobj/ArchiveFolderAppObject.js index dc293a187..bcfced98e 100644 --- a/packages/web/src/appobj/ArchiveFolderAppObject.js +++ b/packages/web/src/appobj/ArchiveFolderAppObject.js @@ -28,7 +28,7 @@ function ArchiveFolderAppObject({ data, commonProps }) { ); } -ArchiveFolderAppObject.extractKey = (data) => data.name; -ArchiveFolderAppObject.createMatcher = (data) => (filter) => filterName(filter, data.name); +ArchiveFolderAppObject.extractKey = data => data.name; +ArchiveFolderAppObject.createMatcher = data => filter => filterName(filter, data.name); export default ArchiveFolderAppObject; diff --git a/packages/web/src/appobj/ClosedTabAppObject.js b/packages/web/src/appobj/ClosedTabAppObject.js index e046fdd70..4e65490b8 100644 --- a/packages/web/src/appobj/ClosedTabAppObject.js +++ b/packages/web/src/appobj/ClosedTabAppObject.js @@ -8,10 +8,10 @@ import { AppObjectCore } from './AppObjectCore'; function Menu({ data }) { const setOpenedTabs = useSetOpenedTabs(); const handleDelete = () => { - setOpenedTabs((tabs) => tabs.filter((x) => x.tabid != data.tabid)); + setOpenedTabs(tabs => tabs.filter(x => x.tabid != data.tabid)); }; const handleDeleteOlder = () => { - setOpenedTabs((tabs) => tabs.filter((x) => !x.closedTime || x.closedTime >= data.closedTime)); + setOpenedTabs(tabs => tabs.filter(x => !x.closedTime || x.closedTime >= data.closedTime)); }; return ( <> @@ -26,8 +26,8 @@ function ClosedTabAppObject({ data, commonProps }) { const setOpenedTabs = useSetOpenedTabs(); const onClick = () => { - setOpenedTabs((files) => - files.map((x) => ({ + setOpenedTabs(files => + files.map(x => ({ ...x, selected: x.tabid == tabid, closedTime: x.tabid == tabid ? undefined : x.closedTime, @@ -49,6 +49,6 @@ function ClosedTabAppObject({ data, commonProps }) { ); } -ClosedTabAppObject.extractKey = (data) => data.tabid; +ClosedTabAppObject.extractKey = data => data.tabid; export default ClosedTabAppObject; diff --git a/packages/web/src/appobj/ConnectionAppObject.js b/packages/web/src/appobj/ConnectionAppObject.js index 9e7696114..b13313b26 100644 --- a/packages/web/src/appobj/ConnectionAppObject.js +++ b/packages/web/src/appobj/ConnectionAppObject.js @@ -19,10 +19,10 @@ function Menu({ data }) { const config = useConfig(); const handleEdit = () => { - showModal((modalState) => ); + showModal(modalState => ); }; const handleDelete = () => { - showModal((modalState) => ( + showModal(modalState => ( { - showModal((modalState) => ); + showModal(modalState => ); }; const handleRefresh = () => { axios.post('server-connections/refresh', { conid: data._id }); }; const handleDisconnect = () => { - setOpenedConnections((list) => list.filter((x) => x != data._id)); + setOpenedConnections(list => list.filter(x => x != data._id)); }; const handleConnect = () => { - setOpenedConnections((list) => [...list, data._id]); + setOpenedConnections(list => [...list, data._id]); }; return ( <> @@ -72,13 +72,13 @@ function ConnectionAppObject({ data, commonProps }) { const extensions = useExtensions(); const isBold = _.get(currentDatabase, 'connection._id') == _id; - const onClick = () => setOpenedConnections((c) => [...c, _id]); + const onClick = () => setOpenedConnections(c => [...c, _id]); let statusIcon = null; let statusTitle = null; let extInfo = null; - if (extensions.drivers.find((x) => x.engine == engine)) { + if (extensions.drivers.find(x => x.engine == engine)) { const match = (engine || '').match(/^([^@]*)@/); extInfo = match ? match[1] : engine; } else { @@ -113,7 +113,7 @@ function ConnectionAppObject({ data, commonProps }) { ); } -ConnectionAppObject.extractKey = (data) => data._id; -ConnectionAppObject.createMatcher = ({ displayName, server }) => (filter) => filterName(filter, displayName, server); +ConnectionAppObject.extractKey = data => data._id; +ConnectionAppObject.createMatcher = ({ displayName, server }) => filter => filterName(filter, displayName, server); export default ConnectionAppObject; diff --git a/packages/web/src/appobj/DatabaseAppObject.js b/packages/web/src/appobj/DatabaseAppObject.js index abe5dbf5e..c8a137b5a 100644 --- a/packages/web/src/appobj/DatabaseAppObject.js +++ b/packages/web/src/appobj/DatabaseAppObject.js @@ -32,7 +32,7 @@ function Menu({ data }) { }; const handleImport = () => { - showModal((modalState) => ( + showModal(modalState => ( { - showModal((modalState) => ( + showModal(modalState => ( props.name; +DatabaseAppObject.extractKey = props => props.name; export default DatabaseAppObject; diff --git a/packages/web/src/appobj/DatabaseObjectAppObject.js b/packages/web/src/appobj/DatabaseObjectAppObject.js index e612bf2ad..73e08282e 100644 --- a/packages/web/src/appobj/DatabaseObjectAppObject.js +++ b/packages/web/src/appobj/DatabaseObjectAppObject.js @@ -168,12 +168,12 @@ function Menu({ data }) { return ( <> - {menus[data.objectTypeField].map((menu) => ( + {menus[data.objectTypeField].map(menu => ( { if (menu.isExport) { - showModal((modalState) => ( + showModal(modalState => ( schemaName ? `${schemaName}.${pureName}` : pureName; -DatabaseObjectAppObject.createMatcher = ({ pureName }) => (filter) => filterName(filter, pureName); +DatabaseObjectAppObject.createMatcher = ({ pureName }) => filter => filterName(filter, pureName); export default DatabaseObjectAppObject; diff --git a/packages/web/src/appobj/FavoriteFileAppObject.js b/packages/web/src/appobj/FavoriteFileAppObject.js index 1fd08a88d..d9136a0f5 100644 --- a/packages/web/src/appobj/FavoriteFileAppObject.js +++ b/packages/web/src/appobj/FavoriteFileAppObject.js @@ -12,7 +12,7 @@ export function useOpenFavorite() { const openNewTab = useOpenNewTab(); const openFavorite = React.useCallback( - async (favorite) => { + async favorite => { const { icon, tabComponent, title, props, tabdata } = favorite; let tabdataNew = tabdata; if (props.savedFile) { @@ -50,7 +50,7 @@ export function FavoriteFileAppObject({ data, commonProps }) { const electron = getElectron(); const editFavorite = () => { - showModal((modalState) => ); + showModal(modalState => ); }; const editFavoriteJson = async () => { @@ -87,7 +87,7 @@ export function FavoriteFileAppObject({ data, commonProps }) { icon={icon || 'img favorite'} title={title} disableRename - onLoad={async (data) => { + onLoad={async data => { openFavorite(data); }} menuExt={ @@ -101,4 +101,4 @@ export function FavoriteFileAppObject({ data, commonProps }) { ); } -FavoriteFileAppObject.extractKey = (data) => data.file; +FavoriteFileAppObject.extractKey = data => data.file; diff --git a/packages/web/src/appobj/MacroAppObject.js b/packages/web/src/appobj/MacroAppObject.js index c60147852..4a59e6c35 100644 --- a/packages/web/src/appobj/MacroAppObject.js +++ b/packages/web/src/appobj/MacroAppObject.js @@ -9,7 +9,7 @@ function MacroAppObject({ data, commonProps }) { return ; } -MacroAppObject.extractKey = (data) => data.name; -MacroAppObject.createMatcher = ({ name, title }) => (filter) => filterName(filter, name, title); +MacroAppObject.extractKey = data => data.name; +MacroAppObject.createMatcher = ({ name, title }) => filter => filterName(filter, name, title); export default MacroAppObject; diff --git a/packages/web/src/appobj/SavedFileAppObject.js b/packages/web/src/appobj/SavedFileAppObject.js index 076d692d2..244b7cd1d 100644 --- a/packages/web/src/appobj/SavedFileAppObject.js +++ b/packages/web/src/appobj/SavedFileAppObject.js @@ -17,7 +17,7 @@ function Menu({ data, menuExt = null, title = undefined, disableRename = false } const hasPermission = useHasPermission(); const showModal = useShowModal(); const handleDelete = () => { - showModal((modalState) => ( + showModal(modalState => ( { - showModal((modalState) => ( + showModal(modalState => ( { + onConfirm={newFile => { axios.post('files/rename', { ...data, newFile }); }} /> @@ -77,7 +77,7 @@ export function SavedFileAppObjectBase({ title={title || file} icon={icon} onClick={onClick} - Menu={(props) => } + Menu={props => } /> ); } @@ -123,7 +123,7 @@ export function SavedSqlFileAppObject({ data, commonProps }) { Generate shell execute ) : null } - onLoad={(data) => { + onLoad={data => { newQuery({ title: file, initialData: data, @@ -147,7 +147,7 @@ export function SavedShellFileAppObject({ data, commonProps }) { commonProps={commonProps} format="text" icon="img shell" - onLoad={(data) => { + onLoad={data => { openNewTab( { title: file, @@ -183,7 +183,7 @@ export function SavedChartFileAppObject({ data, commonProps }) { commonProps={commonProps} format="json" icon="img chart" - onLoad={(data) => { + onLoad={data => { openNewTab( { title: file, @@ -222,7 +222,7 @@ export function SavedQueryFileAppObject({ data, commonProps }) { commonProps={commonProps} format="json" icon="img query-design" - onLoad={(data) => { + onLoad={data => { openNewTab( { title: file, @@ -266,7 +266,7 @@ export function SavedMarkdownFileAppObject({ data, commonProps }) { commonProps={commonProps} format="text" icon="img markdown" - onLoad={(data) => { + onLoad={data => { openNewTab( { title: file, @@ -308,7 +308,7 @@ export function SavedFileAppObject({ data, commonProps }) { SavedChartFileAppObject, SavedMarkdownFileAppObject, SavedFileAppObject, -].forEach((fn) => { +].forEach(fn => { // @ts-ignore - fn.extractKey = (data) => data.file; + fn.extractKey = data => data.file; }); diff --git a/packages/web/src/celldata/CellDataView.js b/packages/web/src/celldata/CellDataView.js index c79a39044..bea7c6ec5 100644 --- a/packages/web/src/celldata/CellDataView.js +++ b/packages/web/src/celldata/CellDataView.js @@ -9,7 +9,7 @@ import useTheme from '../theme/useTheme'; const Toolbar = styled.div` display: flex; - background: ${(props) => props.theme.toolbar_background}; + background: ${props => props.theme.toolbar_background}; align-items: center; `; @@ -65,10 +65,10 @@ export default function CellDataView({ selection = undefined, grider = undefined value = selectedValue; } const autodetectFormatType = React.useMemo(() => autodetect(selection, grider, value), [selection, grider, value]); - const autodetectFormat = formats.find((x) => x.type == autodetectFormatType); + const autodetectFormat = formats.find(x => x.type == autodetectFormatType); const usedFormatType = selectedFormatType == 'autodetect' ? autodetectFormatType : selectedFormatType; - const usedFormat = formats.find((x) => x.type == usedFormatType); + const usedFormat = formats.find(x => x.type == usedFormatType); const { Component } = usedFormat || {}; @@ -76,10 +76,10 @@ export default function CellDataView({ selection = undefined, grider = undefined Format: - setSelectedFormatType(e.target.value)}> + setSelectedFormatType(e.target.value)}> - {formats.map((fmt) => ( + {formats.map(fmt => ( diff --git a/packages/web/src/charts/ChartEditor.js b/packages/web/src/charts/ChartEditor.js index d204029f2..588f740a0 100644 --- a/packages/web/src/charts/ChartEditor.js +++ b/packages/web/src/charts/ChartEditor.js @@ -19,7 +19,7 @@ import { presetPrimaryColors } from '@ant-design/colors'; import ErrorInfo from '../widgets/ErrorInfo'; const LeftContainer = styled.div` - background-color: ${(props) => props.theme.manager_background}; + background-color: ${props => props.theme.manager_background}; display: flex; flex: 1; `; @@ -71,7 +71,7 @@ export default function ChartEditor({ data, config, setConfig, sql, conid, datab React.useEffect(() => { if (data) { - setAvailableColumnNames(data ? data.structure.columns.map((x) => x.columnName) : []); + setAvailableColumnNames(data ? data.structure.columns.map(x => x.columnName) : []); } }, [data]); @@ -119,21 +119,21 @@ export default function ChartEditor({ data, config, setConfig, sql, conid, datab {availableColumnNames.length > 0 && ( - {availableColumnNames.map((col) => ( + {availableColumnNames.map(col => ( ))} )} - {availableColumnNames.map((col) => ( + {availableColumnNames.map(col => ( {config[`dataColumn_${col}`] && ( - {_.keys(presetPrimaryColors).map((color) => ( + {_.keys(presetPrimaryColors).map(color => ( diff --git a/packages/web/src/charts/DataChart.js b/packages/web/src/charts/DataChart.js index 6a6fb04fb..6afcf36dc 100644 --- a/packages/web/src/charts/DataChart.js +++ b/packages/web/src/charts/DataChart.js @@ -27,8 +27,8 @@ function getTimeAxis(labels) { function getLabels(labelValues, timeAxis, chartType) { if (!timeAxis) return labelValues; - if (chartType === 'line') return timeAxis.map((x) => x.toDate()); - return timeAxis.map((x) => x.format('D. M. YYYY')); + if (chartType === 'line') return timeAxis.map(x => x.toDate()); + return timeAxis.map(x => x.format('D. M. YYYY')); } function getOptions(timeAxis, chartType) { @@ -70,7 +70,7 @@ function createChartData(freeData, labelColumn, dataColumns, colorSeed, chartTyp }); let backgroundColor = null; let borderColor = null; - const labelValues = freeData.rows.map((x) => x[labelColumn]); + const labelValues = freeData.rows.map(x => x[labelColumn]); const timeAxis = getTimeAxis(labelValues); const labels = getLabels(labelValues, timeAxis, chartType); const res = { @@ -91,7 +91,7 @@ function createChartData(freeData, labelColumn, dataColumns, colorSeed, chartTyp return { label: dataColumn, - data: freeData.rows.map((row) => row[dataColumn]), + data: freeData.rows.map(row => row[dataColumn]), backgroundColor, borderColor, borderWidth: 1, diff --git a/packages/web/src/charts/chartDataLoader.ts b/packages/web/src/charts/chartDataLoader.ts index dfed5bf30..7ee23cadd 100644 --- a/packages/web/src/charts/chartDataLoader.ts +++ b/packages/web/src/charts/chartDataLoader.ts @@ -19,7 +19,7 @@ export async function loadChartStructure(driver: EngineDriver, conid, database, dumpSqlSelect(dmp, select); const resp = await axios.post('database-connections/query-data', { conid, database, sql: dmp.s }); if (resp.data.errorMessage) throw new Error(resp.data.errorMessage); - return resp.data.columns.map((x) => x.columnName); + return resp.data.columns.map(x => x.columnName); } export async function loadChartData(driver: EngineDriver, conid, database, sql, config) { @@ -38,7 +38,7 @@ export async function loadChartData(driver: EngineDriver, conid, database, sql, alias: labelColumn, }, // @ts-ignore - ...dataColumns.map((columnName) => ({ + ...dataColumns.map(columnName => ({ exprType: 'call', func: 'SUM', args: [ @@ -81,12 +81,12 @@ export async function loadChartData(driver: EngineDriver, conid, database, sql, rows = _.reverse([...rows]); } if (showRelativeValues) { - const maxValues = dataColumns.map((col) => _.max(rows.map((row) => row[col]))); + const maxValues = dataColumns.map(col => _.max(rows.map(row => row[col]))); for (const [col, max] of _.zip(dataColumns, maxValues)) { if (!max) continue; if (!_.isNumber(max)) continue; if (!(max > 0)) continue; - rows = rows.map((row) => ({ + rows = rows.map(row => ({ ...row, [col]: (row[col] / max) * 100, })); diff --git a/packages/web/src/datagrid/ChangeSetGrider.ts b/packages/web/src/datagrid/ChangeSetGrider.ts index 6db15b0cc..6aac275b6 100644 --- a/packages/web/src/datagrid/ChangeSetGrider.ts +++ b/packages/web/src/datagrid/ChangeSetGrider.ts @@ -26,7 +26,7 @@ export default class ChangeSetGrider extends Grider { super(); this.changeSet = changeSetState && changeSetState.value; this.insertedRows = getChangeSetInsertedRows(this.changeSet, display.baseTable); - this.setChangeSet = (value) => dispatchChangeSet({ type: 'set', value }); + this.setChangeSet = value => dispatchChangeSet({ type: 'set', value }); this.rowCacheIndexes = new Set(); this.rowDataCache = {}; this.rowStatusCache = {}; @@ -98,12 +98,12 @@ export default class ChangeSetGrider extends Grider { setCellValue(index: number, uniqueName: string, value: any) { const row = this.getRowSource(index); const definition = this.display.getChangeSetField(row, uniqueName, this.getInsertedRowIndex(index)); - this.applyModification((chs) => setChangeSetValue(chs, definition, value)); + this.applyModification(chs => setChangeSetValue(chs, definition, value)); } deleteRow(index: number) { this.requireRowCache(index); - this.applyModification((chs) => deleteChangeSetRows(chs, this.rowDefinitionsCache[index])); + this.applyModification(chs => deleteChangeSetRows(chs, this.rowDefinitionsCache[index])); } get rowCountInUpdate() { @@ -117,7 +117,7 @@ export default class ChangeSetGrider extends Grider { insertRow(): number { const res = this.rowCountInUpdate; - this.applyModification((chs) => changeSetInsertNewRow(chs, this.display.baseTable)); + this.applyModification(chs => changeSetInsertNewRow(chs, this.display.baseTable)); return res; } @@ -131,10 +131,10 @@ export default class ChangeSetGrider extends Grider { revertRowChanges(index: number) { this.requireRowCache(index); - this.applyModification((chs) => revertChangeSetRowChanges(chs, this.rowDefinitionsCache[index])); + this.applyModification(chs => revertChangeSetRowChanges(chs, this.rowDefinitionsCache[index])); } revertAllChanges() { - this.applyModification((chs) => createChangeSet()); + this.applyModification(chs => createChangeSet()); } undo() { this.dispatchChangeSet({ type: 'undo' }); diff --git a/packages/web/src/datagrid/ColumnHeaderControl.js b/packages/web/src/datagrid/ColumnHeaderControl.js index 1a7bb7dee..e3f50c213 100644 --- a/packages/web/src/datagrid/ColumnHeaderControl.js +++ b/packages/web/src/datagrid/ColumnHeaderControl.js @@ -29,7 +29,7 @@ const IconWrapper = styled.span` `; const ResizeHandle = styled.div` - background-color: ${(props) => props.theme.border}; + background-color: ${props => props.theme.border}; width: 2px; cursor: col-resize; z-index: 1; diff --git a/packages/web/src/datagrid/ColumnLabel.js b/packages/web/src/datagrid/ColumnLabel.js index 0523bcd50..1cda97227 100644 --- a/packages/web/src/datagrid/ColumnLabel.js +++ b/packages/web/src/datagrid/ColumnLabel.js @@ -5,7 +5,7 @@ import styled from 'styled-components'; import { FontIcon } from '../icons'; const Label = styled.span` - font-weight: ${(props) => (props.notNull ? 'bold' : 'normal')}; + font-weight: ${props => (props.notNull ? 'bold' : 'normal')}; white-space: nowrap; `; diff --git a/packages/web/src/datagrid/ColumnManager.js b/packages/web/src/datagrid/ColumnManager.js index 6ab6cc809..1ae61b112 100644 --- a/packages/web/src/datagrid/ColumnManager.js +++ b/packages/web/src/datagrid/ColumnManager.js @@ -16,7 +16,7 @@ const Row = styled.div` cursor: pointer; white-space: nowrap; &:hover { - background-color: ${(props) => props.theme.manager_background_blue[1]}; + background-color: ${props => props.theme.manager_background_blue[1]}; } `; @@ -46,7 +46,7 @@ function ColumnManagerRow(props) { onMouseEnter={() => setIsHover(true)} onMouseLeave={() => setIsHover(false)} theme={theme} - onClick={(e) => { + onClick={e => { // @ts-ignore if (e.target.closest('.expandColumnIcon')) return; display.focusColumn(column.uniqueName); @@ -84,8 +84,8 @@ export default function ColumnManager(props) { {display .getColumns(columnFilter) - .filter((column) => filterName(columnFilter, column.columnName)) - .map((column) => ( + .filter(column => filterName(columnFilter, column.columnName)) + .map(column => ( ))} diff --git a/packages/web/src/datagrid/DataGrid.js b/packages/web/src/datagrid/DataGrid.js index 050eacf78..d8cca115a 100644 --- a/packages/web/src/datagrid/DataGrid.js +++ b/packages/web/src/datagrid/DataGrid.js @@ -10,7 +10,7 @@ import CellDataView from '../celldata/CellDataView'; import useTheme from '../theme/useTheme'; const LeftContainer = styled.div` - background-color: ${(props) => props.theme.manager_background}; + background-color: ${props => props.theme.manager_background}; display: flex; flex: 1; `; diff --git a/packages/web/src/datagrid/DataGridRow.js b/packages/web/src/datagrid/DataGridRow.js index a70d1c1d6..f468ac252 100644 --- a/packages/web/src/datagrid/DataGridRow.js +++ b/packages/web/src/datagrid/DataGridRow.js @@ -11,13 +11,13 @@ import { FontIcon } from '../icons'; const TableBodyCell = styled.td` font-weight: normal; - border: 1px solid ${(props) => props.theme.border}; + border: 1px solid ${props => props.theme.border}; // border-collapse: collapse; padding: 2px; white-space: nowrap; position: relative; overflow: hidden; - ${(props) => + ${props => props.isSelected && !props.isAutofillSelected && !props.isFocusedColumn && @@ -26,20 +26,20 @@ const TableBodyCell = styled.td` background-color: ${props.theme.gridbody_selection[4]}; color: ${props.theme.gridbody_invfont1};`} - ${(props) => + ${props => props.isFrameSelected && ` outline: 3px solid ${props.theme.gridbody_selection[4]}; outline-offset: -3px;`} - ${(props) => + ${props => props.isAutofillSelected && !props.isFocusedColumn && ` outline: 3px solid ${props.theme.gridbody_selection[4]}; outline-offset: -3px;`} - ${(props) => + ${props => props.isModifiedRow && !props.isInsertedRow && !props.isSelected && @@ -48,7 +48,7 @@ const TableBodyCell = styled.td` !props.isFocusedColumn && ` background-color: ${props.theme.gridbody_background_gold[1]};`} - ${(props) => + ${props => !props.isSelected && !props.isAutofillSelected && !props.isInsertedRow && @@ -57,7 +57,7 @@ const TableBodyCell = styled.td` ` background-color: ${props.theme.gridbody_background_orange[1]};`} - ${(props) => + ${props => !props.isSelected && !props.isAutofillSelected && !props.isFocusedColumn && @@ -65,7 +65,7 @@ const TableBodyCell = styled.td` ` background-color: ${props.theme.gridbody_background_green[1]};`} - ${(props) => + ${props => !props.isSelected && !props.isAutofillSelected && !props.isFocusedColumn && @@ -74,13 +74,13 @@ const TableBodyCell = styled.td` background-color: ${props.theme.gridbody_background_volcano[1]}; `} - ${(props) => + ${props => props.isFocusedColumn && ` background-color: ${props.theme.gridbody_background_yellow[0]}; `} - ${(props) => + ${props => props.isDeletedRow && ` background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAEElEQVQImWNgIAX8x4KJBAD+agT8INXz9wAAAABJRU5ErkJggg=='); @@ -90,30 +90,30 @@ const TableBodyCell = styled.td` `; const HintSpan = styled.span` - color: ${(props) => props.theme.gridbody_font3}; + color: ${props => props.theme.gridbody_font3}; margin-left: 5px; `; const NullSpan = styled.span` - color: ${(props) => props.theme.gridbody_font3}; + color: ${props => props.theme.gridbody_font3}; font-style: italic; `; const TableBodyRow = styled.tr` // height: 35px; - background-color: ${(props) => props.theme.gridbody_background}; + background-color: ${props => props.theme.gridbody_background}; &:nth-child(6n + 3) { - background-color: ${(props) => props.theme.gridbody_background_alt2}; + background-color: ${props => props.theme.gridbody_background_alt2}; } &:nth-child(6n + 6) { - background-color: ${(props) => props.theme.gridbody_background_alt3}; + background-color: ${props => props.theme.gridbody_background_alt3}; } `; const TableHeaderCell = styled.td` - border: 1px solid ${(props) => props.theme.border}; + border: 1px solid ${props => props.theme.border}; text-align: left; padding: 2px; - background-color: ${(props) => props.theme.gridheader_background}; + background-color: ${props => props.theme.gridheader_background}; overflow: hidden; position: relative; `; @@ -121,7 +121,7 @@ const TableHeaderCell = styled.td` const AutoFillPoint = styled.div` width: 8px; height: 8px; - background-color: ${(props) => props.theme.gridbody_selection[6]}; + background-color: ${props => props.theme.gridbody_selection[6]}; position: absolute; right: 0px; bottom: 0px; @@ -133,12 +133,12 @@ export const ShowFormButton = styled.div` position: absolute; right: 0px; top: 1px; - color: ${(props) => props.theme.gridbody_font3}; - background-color: ${(props) => props.theme.gridheader_background}; - border: 1px solid ${(props) => props.theme.gridheader_background}; + color: ${props => props.theme.gridbody_font3}; + background-color: ${props => props.theme.gridheader_background}; + border: 1px solid ${props => props.theme.gridheader_background}; &:hover { - color: ${(props) => props.theme.gridheader_font_hover}; - border: 1px solid ${(props) => props.theme.border}; + color: ${props => props.theme.gridheader_font_hover}; + border: 1px solid ${props => props.theme.border}; top: 1px; right: 0px; } @@ -199,7 +199,7 @@ function RowHeaderCell({ rowIndex, theme, onSetFormView, rowData }) { {!!onSetFormView && mouseIn && ( { + onClick={e => { e.stopPropagation(); onSetFormView(rowData); }} @@ -251,12 +251,12 @@ function DataGridRow(props) { const rowStatus = grider.getRowStatus(rowIndex); const hintFieldsAllowed = visibleRealColumns - .filter((col) => { + .filter(col => { if (!col.hintColumnName) return false; if (rowStatus.modifiedFields && rowStatus.modifiedFields.has(col.uniqueName)) return false; return true; }) - .map((col) => col.uniqueName); + .map(col => col.uniqueName); if (!rowData) return null; @@ -264,7 +264,7 @@ function DataGridRow(props) { - {visibleRealColumns.map((col) => ( + {visibleRealColumns.map(col => ( grider.setCellValue(rowIndex, col.uniqueName, value)} + onSetValue={value => grider.setCellValue(rowIndex, col.uniqueName, value)} /> ) : ( <> @@ -311,7 +311,7 @@ function DataGridRow(props) { { + onClick={e => { e.stopPropagation(); onSetFormView(rowData, col); }} diff --git a/packages/web/src/datagrid/JslDataGridCore.js b/packages/web/src/datagrid/JslDataGridCore.js index 04c469ab4..1ec74e608 100644 --- a/packages/web/src/datagrid/JslDataGridCore.js +++ b/packages/web/src/datagrid/JslDataGridCore.js @@ -40,7 +40,7 @@ async function loadRowCount(props) { export default function JslDataGridCore(props) { const { jslid } = props; const [changeIndex, setChangeIndex] = React.useState(0); - const [rowCountLoaded, setRowCountLoaded]= React.useState(null); + const [rowCountLoaded, setRowCountLoaded] = React.useState(null); const showModal = useShowModal(); @@ -59,11 +59,11 @@ export default function JslDataGridCore(props) { initialValues.sourceJslId = jslid; initialValues.sourceList = ['query-data']; } - showModal((modalState) => ); + showModal(modalState => ); } const handleJslDataStats = React.useCallback( - (stats) => { + stats => { if (stats.changeIndex < changeIndex) return; setChangeIndex(stats.changeIndex); setRowCountLoaded(stats.rowCount); diff --git a/packages/web/src/datagrid/LoadingDataGridCore.js b/packages/web/src/datagrid/LoadingDataGridCore.js index 107ef0ca1..f3a4f5029 100644 --- a/packages/web/src/datagrid/LoadingDataGridCore.js +++ b/packages/web/src/datagrid/LoadingDataGridCore.js @@ -32,7 +32,7 @@ export default function LoadingDataGridCore(props) { const handleLoadRowCount = async () => { const rowCount = await loadRowCount(props); - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, allRowCount: rowCount, })); @@ -62,7 +62,7 @@ export default function LoadingDataGridCore(props) { const loadNextData = async () => { if (isLoading) return; - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoading: true, })); @@ -80,7 +80,7 @@ export default function LoadingDataGridCore(props) { // } // console.log('nextRows', nextRows); if (nextRows.errorMessage) { - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoading: false, errorMessage: nextRows.errorMessage, @@ -91,7 +91,7 @@ export default function LoadingDataGridCore(props) { loadedRows: [...loadedRows, ...nextRows], loadedTime, }; - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoading: false, isLoadedAll: oldLoadProps.loadNextDataToken == loadNextDataToken && nextRows.length === 0, @@ -102,7 +102,7 @@ export default function LoadingDataGridCore(props) { }; React.useEffect(() => { - setLoadProps((oldProps) => ({ + setLoadProps(oldProps => ({ ...oldProps, isLoadedAll: false, })); diff --git a/packages/web/src/datagrid/ManagerStyles.js b/packages/web/src/datagrid/ManagerStyles.js index 578c03d2c..6de11af95 100644 --- a/packages/web/src/datagrid/ManagerStyles.js +++ b/packages/web/src/datagrid/ManagerStyles.js @@ -5,4 +5,3 @@ export const ManagerInnerContainer = styled.div` overflow-y: auto; overflow-x: auto; `; - diff --git a/packages/web/src/datagrid/ReferenceHeader.js b/packages/web/src/datagrid/ReferenceHeader.js index 8180a78a7..4f723a320 100644 --- a/packages/web/src/datagrid/ReferenceHeader.js +++ b/packages/web/src/datagrid/ReferenceHeader.js @@ -9,12 +9,12 @@ const Container = styled.div` display: flex; justify-content: space-between; align-items: center; - background: ${(props) => props.theme.gridheader_background_cyan[0]}; + background: ${props => props.theme.gridheader_background_cyan[0]}; height: ${dimensions.toolBar.height}px; min-height: ${dimensions.toolBar.height}px; overflow: hidden; - border-top: 1px solid ${(props) => props.theme.border}; - border-bottom: 1px solid ${(props) => props.theme.border}; + border-top: 1px solid ${props => props.theme.border}; + border-bottom: 1px solid ${props => props.theme.border}; `; const Header = styled.div` @@ -34,8 +34,8 @@ export default function ReferenceHeader({ reference, onClose }) {
- {reference.pureName} [{reference.columns.map((x) => x.refName).join(', ')}] = master [ - {reference.columns.map((x) => x.baseName).join(', ')}] + {reference.pureName} [{reference.columns.map(x => x.refName).join(', ')}] = master [ + {reference.columns.map(x => x.baseName).join(', ')}]
diff --git a/packages/web/src/datagrid/ReferenceManager.js b/packages/web/src/datagrid/ReferenceManager.js index 1adb2ac76..76b1cfc0e 100644 --- a/packages/web/src/datagrid/ReferenceManager.js +++ b/packages/web/src/datagrid/ReferenceManager.js @@ -17,7 +17,7 @@ const Header = styled.div` `; const LinkContainer = styled.div` - color: ${props=>props.theme.manager_font_blue[7]}; + color: ${props => props.theme.manager_font_blue[7]}; margin: 5px; &:hover { text-decoration: underline; @@ -38,7 +38,7 @@ function ManagerRow({ tableName, columns, icon, onClick }) { - {tableName} ({columns.map((x) => x.columnName).join(', ')}) + {tableName} ({columns.map(x => x.columnName).join(', ')}) ); @@ -62,8 +62,8 @@ export default function ReferenceManager(props) { <>
References tables ({foreignKeys.length})
{foreignKeys - .filter((fk) => filterName(filter, fk.refTableName)) - .map((fk) => ( + .filter(fk => filterName(filter, fk.refTableName)) + .map(fk => ( ({ + columns: fk.columns.map(col => ({ baseName: col.columnName, refName: col.refColumnName, })), @@ -87,8 +87,8 @@ export default function ReferenceManager(props) { <>
Dependend tables ({dependencies.length})
{dependencies - .filter((fk) => filterName(filter, fk.pureName)) - .map((fk) => ( + .filter(fk => filterName(filter, fk.pureName)) + .map(fk => ( ({ + columns: fk.columns.map(col => ({ baseName: col.refColumnName, refName: col.columnName, })), diff --git a/packages/web/src/datagrid/SeriesSizes-old.js b/packages/web/src/datagrid/SeriesSizes-old.js index 5cc319161..6c8f98d85 100644 --- a/packages/web/src/datagrid/SeriesSizes-old.js +++ b/packages/web/src/datagrid/SeriesSizes-old.js @@ -120,7 +120,7 @@ export class SeriesSizes { ); } getFrozenIndexOnPosition(position) { - this.frozenItems.forEach(function(item) { + this.frozenItems.forEach(function (item) { if (position >= item.position && position <= item.endPosition) return item.frozenIndex; }); return -1; diff --git a/packages/web/src/datagrid/SeriesSizes.ts b/packages/web/src/datagrid/SeriesSizes.ts index 1f88eae0d..f221a4c56 100644 --- a/packages/web/src/datagrid/SeriesSizes.ts +++ b/packages/web/src/datagrid/SeriesSizes.ts @@ -31,7 +31,7 @@ export class SeriesSizes { return this.frozenModelIndexes != null ? this.frozenModelIndexes.length : 0; } public get frozenSize(): number { - return _.sumBy(this.frozenItems, (x) => x.size); + return _.sumBy(this.frozenItems, x => x.size); } public get realCount(): number { return this.frozenCount + this.scrollCount; @@ -63,14 +63,14 @@ export class SeriesSizes { public buildIndex(): void { this.scrollItems = []; this.scrollIndexes = _.filter( - _.map(_.range(this.count), (x) => this.modelToReal(x) - this.frozenCount), + _.map(_.range(this.count), x => this.modelToReal(x) - this.frozenCount), // _.map(this.intKeys(_.keys(this.sizeOverridesByModelIndex)), (x) => this.modelToReal(x) - this.frozenCount), - (x) => x >= 0 + x => x >= 0 ); this.scrollIndexes.sort(); let lastScrollIndex: number = -1; let lastEndPosition: number = 0; - this.scrollIndexes.forEach((scrollIndex) => { + this.scrollIndexes.forEach(scrollIndex => { let modelIndex: number = this.realToModel(scrollIndex + this.frozenCount); let size: number = this.sizeOverridesByModelIndex[modelIndex]; let item = new SeriesSizeItem(); @@ -82,7 +82,7 @@ export class SeriesSizes { lastScrollIndex = scrollIndex; lastEndPosition = item.endPosition; }); - this.positions = _.map(this.scrollItems, (x) => x.position); + this.positions = _.map(this.scrollItems, x => x.position); this.frozenItems = []; let lastpos: number = 0; for (let i: number = 0; i < this.frozenCount; i++) { @@ -157,11 +157,11 @@ export class SeriesSizes { public getScroll(sourceScrollIndex: number, targetScrollIndex: number): number { if (sourceScrollIndex < targetScrollIndex) { return -_.sum( - _.map(_.range(sourceScrollIndex, targetScrollIndex - sourceScrollIndex), (x) => this.getSizeByScrollIndex(x)) + _.map(_.range(sourceScrollIndex, targetScrollIndex - sourceScrollIndex), x => this.getSizeByScrollIndex(x)) ); } else { return _.sum( - _.map(_.range(targetScrollIndex, sourceScrollIndex - targetScrollIndex), (x) => this.getSizeByScrollIndex(x)) + _.map(_.range(targetScrollIndex, sourceScrollIndex - targetScrollIndex), x => this.getSizeByScrollIndex(x)) ); } } @@ -171,15 +171,15 @@ export class SeriesSizes { } public getTotalScrollSizeSum(): number { let scrollSizeOverrides = _.map( - _.filter(this.intKeys(this.sizeOverridesByModelIndex), (x) => this.modelIndexIsInScrollArea(x)), - (x) => this.sizeOverridesByModelIndex[x] + _.filter(this.intKeys(this.sizeOverridesByModelIndex), x => this.modelIndexIsInScrollArea(x)), + x => this.sizeOverridesByModelIndex[x] ); return _.sum(scrollSizeOverrides) + (this.count - scrollSizeOverrides.length) * this.defaultSize; } public getVisibleScrollSizeSum(): number { let scrollSizeOverrides = _.map( - _.filter(this.intKeys(this.sizeOverridesByModelIndex), (x) => !_.includes(this.hiddenAndFrozenModelIndexes, x)), - (x) => this.sizeOverridesByModelIndex[x] + _.filter(this.intKeys(this.sizeOverridesByModelIndex), x => !_.includes(this.hiddenAndFrozenModelIndexes, x)), + x => this.sizeOverridesByModelIndex[x] ); return ( _.sum(scrollSizeOverrides) + @@ -187,7 +187,7 @@ export class SeriesSizes { ); } private intKeys(value): number[] { - return _.keys(value).map((x) => _.parseInt(x)); + return _.keys(value).map(x => _.parseInt(x)); } public getPositionByRealIndex(realIndex: number): number { if (realIndex < 0) return 0; @@ -289,13 +289,13 @@ export class SeriesSizes { } public setExtraordinaryIndexes(hidden: number[], frozen: number[]): void { //this._hiddenAndFrozenModelIndexes = _.clone(hidden); - hidden = hidden.filter((x) => x >= 0); - frozen = frozen.filter((x) => x >= 0); + hidden = hidden.filter(x => x >= 0); + frozen = frozen.filter(x => x >= 0); hidden.sort((a, b) => a - b); frozen.sort((a, b) => a - b); - this.frozenModelIndexes = _.filter(frozen, (x) => !_.includes(hidden, x)); - this.hiddenModelIndexes = _.filter(hidden, (x) => !_.includes(frozen, x)); + this.frozenModelIndexes = _.filter(frozen, x => !_.includes(hidden, x)); + this.hiddenModelIndexes = _.filter(hidden, x => !_.includes(frozen, x)); this.hiddenAndFrozenModelIndexes = _.concat(hidden, this.frozenModelIndexes); this.frozenModelIndexes.sort((a, b) => a - b); if (this.hiddenAndFrozenModelIndexes.length == 0) this.hiddenAndFrozenModelIndexes = null; diff --git a/packages/web/src/datagrid/TableDataGrid.js b/packages/web/src/datagrid/TableDataGrid.js index 0c117faa1..e7ab591e8 100644 --- a/packages/web/src/datagrid/TableDataGrid.js +++ b/packages/web/src/datagrid/TableDataGrid.js @@ -56,12 +56,12 @@ export default function TableDataGrid({ const { childConfig } = config; const setChildConfig = (value, reference = undefined) => { if (_.isFunction(value)) { - setConfig((x) => ({ + setConfig(x => ({ ...x, childConfig: value(x.childConfig), })); } else { - setConfig((x) => ({ + setConfig(x => ({ ...x, childConfig: value, reference: reference === undefined ? x.reference : reference, @@ -106,7 +106,7 @@ export default function TableDataGrid({ const [formDisplay, setFormDisplay] = React.useState(createFormDisplay()); React.useEffect(() => { - setRefReloadToken((v) => v + 1); + setRefReloadToken(v => v + 1); if (!reference && display && display.isGrouped) display.clearGrouping(); }, [reference]); @@ -151,18 +151,18 @@ export default function TableDataGrid({ const filters = { ...filtersBase, ..._.fromPairs( - reference.columns.map((col) => [ + reference.columns.map(col => [ col.refName, - selectedRows.map((x) => getFilterValueExpression(x[col.baseName], col.dataType)).join(', '), + selectedRows.map(x => getFilterValueExpression(x[col.baseName], col.dataType)).join(', '), ]) ), }; if (stableStringify(filters) != stableStringify(childConfig.filters)) { - setChildConfig((cfg) => ({ + setChildConfig(cfg => ({ ...cfg, filters, })); - setChildCache((ca) => ({ + setChildCache(ca => ({ ...ca, refreshTime: new Date().getTime(), })); @@ -192,7 +192,7 @@ export default function TableDataGrid({ dispatchChangeSet={dispatchChangeSet} toolbarPortalRef={toolbarPortalRef} showReferences - onReferenceClick={(reference) => setChildConfig(createGridConfig(), reference)} + onReferenceClick={reference => setChildConfig(createGridConfig(), reference)} onReferenceSourceChanged={reference ? handleReferenceSourceChanged : null} refReloadToken={refReloadToken.toString()} masterLoadedTime={masterLoadedTime} diff --git a/packages/web/src/datagrid/gridutil.ts b/packages/web/src/datagrid/gridutil.ts index 7d763c51f..bf64c2a94 100644 --- a/packages/web/src/datagrid/gridutil.ts +++ b/packages/web/src/datagrid/gridutil.ts @@ -128,7 +128,7 @@ export function filterCellForRow(cell, row: number): CellAddress | null { } export function filterCellsForRow(cells, row: number): CellAddress[] | null { - const res = (cells || []).filter((x) => x[0] == row || _.isString(x[0])); + const res = (cells || []).filter(x => x[0] == row || _.isString(x[0])); return res.length > 0 ? res : null; } diff --git a/packages/web/src/datagrid/selection.ts b/packages/web/src/datagrid/selection.ts index 2c4e3d693..28ff9384a 100644 --- a/packages/web/src/datagrid/selection.ts +++ b/packages/web/src/datagrid/selection.ts @@ -67,4 +67,3 @@ export function cellFromEvent(event): CellAddress { const row = cell.getAttribute('data-row'); return convertCellAddress(row, col); } - diff --git a/packages/web/src/designer/Designer.js b/packages/web/src/designer/Designer.js index 7d951bb05..076799aac 100644 --- a/packages/web/src/designer/Designer.js +++ b/packages/web/src/designer/Designer.js @@ -11,7 +11,7 @@ import { getTableInfo } from '../utility/metadataLoaders'; const Wrapper = styled.div` flex: 1; - background-color: ${(props) => props.theme.designer_background}; + background-color: ${props => props.theme.designer_background}; overflow: scroll; `; @@ -27,12 +27,12 @@ const EmptyInfo = styled.div` `; function fixPositions(tables) { - const minLeft = _.min(tables.map((x) => x.left)); - const minTop = _.min(tables.map((x) => x.top)); + const minLeft = _.min(tables.map(x => x.left)); + const minTop = _.min(tables.map(x => x.top)); if (minLeft < 0 || minTop < 0) { const dLeft = minLeft < 0 ? -minLeft : 0; const dTop = minTop < 0 ? -minTop : 0; - return tables.map((tbl) => ({ + return tables.map(tbl => ({ ...tbl, left: tbl.left + dLeft, top: tbl.top + dTop, @@ -51,7 +51,7 @@ export default function Designer({ value, onChange, conid, database }) { const wrapperRef = React.useRef(); const [changeToken, setChangeToken] = React.useState(0); - const handleDrop = (e) => { + const handleDrop = e => { var data = e.dataTransfer.getData('app_object_drag_data'); e.preventDefault(); if (!data) return; @@ -63,11 +63,11 @@ export default function Designer({ value, onChange, conid, database }) { json.left = e.clientX - rect.left; json.top = e.clientY - rect.top; - onChange((current) => { + onChange(current => { const foreignKeys = _.compact([ - ...(json.foreignKeys || []).map((fk) => { + ...(json.foreignKeys || []).map(fk => { const tables = ((current || {}).tables || []).filter( - (tbl) => fk.refTableName == tbl.pureName && fk.refSchemaName == tbl.schemaName + tbl => fk.refTableName == tbl.pureName && fk.refSchemaName == tbl.schemaName ); if (tables.length == 1) return { @@ -78,8 +78,8 @@ export default function Designer({ value, onChange, conid, database }) { return null; }), ..._.flatten( - ((current || {}).tables || []).map((tbl) => - (tbl.foreignKeys || []).map((fk) => { + ((current || {}).tables || []).map(tbl => + (tbl.foreignKeys || []).map(fk => { if (fk.refTableName == json.pureName && fk.refSchemaName == json.schemaName) { return { ...fk, @@ -105,7 +105,7 @@ export default function Designer({ value, onChange, conid, database }) { sourceId: foreignKeys[0].sourceId, targetId: foreignKeys[0].targetId, joinType: 'INNER JOIN', - columns: foreignKeys[0].columns.map((col) => ({ + columns: foreignKeys[0].columns.map(col => ({ source: col.columnName, target: col.refColumnName, })), @@ -117,21 +117,21 @@ export default function Designer({ value, onChange, conid, database }) { }; const changeTable = React.useCallback( - (table) => { - onChange((current) => ({ + table => { + onChange(current => ({ ...current, - tables: fixPositions((current.tables || []).map((x) => (x.designerId == table.designerId ? table : x))), + tables: fixPositions((current.tables || []).map(x => (x.designerId == table.designerId ? table : x))), })); }, [onChange] ); const bringToFront = React.useCallback( - (table) => { + table => { onChange( - (current) => ({ + current => ({ ...current, - tables: [...(current.tables || []).filter((x) => x.designerId != table.designerId), table], + tables: [...(current.tables || []).filter(x => x.designerId != table.designerId), table], }), true ); @@ -140,43 +140,43 @@ export default function Designer({ value, onChange, conid, database }) { ); const removeTable = React.useCallback( - (table) => { - onChange((current) => ({ + table => { + onChange(current => ({ ...current, - tables: (current.tables || []).filter((x) => x.designerId != table.designerId), + tables: (current.tables || []).filter(x => x.designerId != table.designerId), references: (current.references || []).filter( - (x) => x.sourceId != table.designerId && x.targetId != table.designerId + x => x.sourceId != table.designerId && x.targetId != table.designerId ), - columns: (current.columns || []).filter((x) => x.designerId != table.designerId), + columns: (current.columns || []).filter(x => x.designerId != table.designerId), })); }, [onChange] ); const changeReference = React.useCallback( - (ref) => { - onChange((current) => ({ + ref => { + onChange(current => ({ ...current, - references: (current.references || []).map((x) => (x.designerId == ref.designerId ? ref : x)), + references: (current.references || []).map(x => (x.designerId == ref.designerId ? ref : x)), })); }, [onChange] ); const removeReference = React.useCallback( - (ref) => { - onChange((current) => ({ + ref => { + onChange(current => ({ ...current, - references: (current.references || []).filter((x) => x.designerId != ref.designerId), + references: (current.references || []).filter(x => x.designerId != ref.designerId), })); }, [onChange] ); const handleCreateReference = (source, target) => { - onChange((current) => { + onChange(current => { const existingReference = (current.references || []).find( - (x) => + x => (x.sourceId == source.designerId && x.targetId == target.designerId) || (x.sourceId == target.designerId && x.targetId == source.designerId) ); @@ -184,7 +184,7 @@ export default function Designer({ value, onChange, conid, database }) { return { ...current, references: existingReference - ? current.references.map((ref) => + ? current.references.map(ref => ref == existingReference ? { ...existingReference, @@ -230,8 +230,8 @@ export default function Designer({ value, onChange, conid, database }) { schemaName: foreignKey.refSchemaName, }); const newTableDesignerId = uuidv1(); - onChange((current) => { - const fromTable = (current.tables || []).find((x) => x.designerId == designerId); + onChange(current => { + const fromTable = (current.tables || []).find(x => x.designerId == designerId); if (!fromTable) return; return { ...current, @@ -251,7 +251,7 @@ export default function Designer({ value, onChange, conid, database }) { sourceId: fromTable.designerId, targetId: newTableDesignerId, joinType: 'INNER JOIN', - columns: foreignKey.columns.map((col) => ({ + columns: foreignKey.columns.map(col => ({ source: col.columnName, target: col.refColumnName, })), @@ -262,12 +262,12 @@ export default function Designer({ value, onChange, conid, database }) { }; const handleSelectColumn = React.useCallback( - (column) => { + column => { onChange( - (current) => ({ + current => ({ ...current, columns: (current.columns || []).find( - (x) => x.designerId == column.designerId && x.columnName == column.columnName + x => x.designerId == column.designerId && x.columnName == column.columnName ) ? current.columns : [...cleanupDesignColumns(current.columns), _.pick(column, ['designerId', 'columnName'])], @@ -280,15 +280,15 @@ export default function Designer({ value, onChange, conid, database }) { const handleChangeColumn = React.useCallback( (column, changeFunc) => { - onChange((current) => { + onChange(current => { const currentColumns = (current || {}).columns || []; const existing = currentColumns.find( - (x) => x.designerId == column.designerId && x.columnName == column.columnName + x => x.designerId == column.designerId && x.columnName == column.columnName ); if (existing) { return { ...current, - columns: currentColumns.map((x) => (x == existing ? changeFunc(existing) : x)), + columns: currentColumns.map(x => (x == existing ? changeFunc(existing) : x)), }; } else { return { @@ -311,8 +311,8 @@ export default function Designer({ value, onChange, conid, database }) { return ( {(tables || []).length == 0 && Drag & drop tables or views from left panel here} - e.preventDefault()} onDrop={handleDrop} ref={wrapperRef}> - {(references || []).map((ref) => ( + e.preventDefault()} onDrop={handleDrop} ref={wrapperRef}> + {(references || []).map(ref => ( ))} - {(tables || []).map((table) => ( + {(tables || []).map(table => ( { + onChangeDomTable={table => { domTablesRef.current[table.designerId] = table; }} designer={value} diff --git a/packages/web/src/designer/DesignerComponentCreator.ts b/packages/web/src/designer/DesignerComponentCreator.ts index 9b3730cb8..0f4ad809a 100644 --- a/packages/web/src/designer/DesignerComponentCreator.ts +++ b/packages/web/src/designer/DesignerComponentCreator.ts @@ -28,7 +28,7 @@ export class DesignerComponent { return this.parentComponent ? this.parentComponent.myAndParentTables : []; } get thisAndSubComponentsTables() { - return [...this.tables, ..._.flatten(this.subComponents.map((x) => x.thisAndSubComponentsTables))]; + return [...this.tables, ..._.flatten(this.subComponents.map(x => x.thisAndSubComponentsTables))]; } } @@ -49,7 +49,7 @@ export class DesignerComponentCreator { root = findPrimaryTable(this.toAdd); } if (!root) return null; - _.remove(this.toAdd, (x) => x == root); + _.remove(this.toAdd, x => x == root); const res = new DesignerComponent(); res.tables.push(root); @@ -60,7 +60,7 @@ export class DesignerComponentCreator { if (ref) { res.tables.push(test); res.nonPrimaryReferences.push(ref); - _.remove(this.toAdd, (x) => x == test); + _.remove(this.toAdd, x => x == test); found = true; break; } diff --git a/packages/web/src/designer/DesignerQueryDumper.ts b/packages/web/src/designer/DesignerQueryDumper.ts index 5b8e319c6..d4c5e4af2 100644 --- a/packages/web/src/designer/DesignerQueryDumper.ts +++ b/packages/web/src/designer/DesignerQueryDumper.ts @@ -26,7 +26,7 @@ export class DesignerQueryDumper { constructor(public designer: DesignerInfo, public components: DesignerComponent[]) {} get topLevelTables(): DesignerTableInfo[] { - return _.flatten(this.components.map((x) => x.tables)); + return _.flatten(this.components.map(x => x.tables)); } dumpComponent(component: DesignerComponent) { @@ -81,15 +81,15 @@ export class DesignerQueryDumper { addConditions(select: Select, tables: DesignerTableInfo[]) { for (const column of this.designer.columns || []) { if (!column.filter) continue; - const table = (this.designer.tables || []).find((x) => x.designerId == column.designerId); + const table = (this.designer.tables || []).find(x => x.designerId == column.designerId); if (!table) continue; - if (!tables.find((x) => x.designerId == table.designerId)) continue; + if (!tables.find(x => x.designerId == table.designerId)) continue; const condition = parseFilter(column.filter, findDesignerFilterType(column, this.designer)); if (condition) { select.where = mergeConditions( select.where, - _.cloneDeepWith(condition, (expr) => { + _.cloneDeepWith(condition, expr => { if (expr.exprType == 'placeholder') return { exprType: 'column', @@ -105,15 +105,15 @@ export class DesignerQueryDumper { addGroupConditions(select: Select, tables: DesignerTableInfo[], selectIsGrouped: boolean) { for (const column of this.designer.columns || []) { if (!column.groupFilter) continue; - const table = (this.designer.tables || []).find((x) => x.designerId == column.designerId); + const table = (this.designer.tables || []).find(x => x.designerId == column.designerId); if (!table) continue; - if (!tables.find((x) => x.designerId == table.designerId)) continue; + if (!tables.find(x => x.designerId == table.designerId)) continue; const condition = parseFilter(column.groupFilter, findDesignerFilterType(column, this.designer)); if (condition) { select.having = mergeConditions( select.having, - _.cloneDeepWith(condition, (expr) => { + _.cloneDeepWith(condition, expr => { if (expr.exprType == 'placeholder') { return this.getColumnOutputExpression(column, selectIsGrouped); } @@ -174,20 +174,20 @@ export class DesignerQueryDumper { } } - const topLevelColumns = (this.designer.columns || []).filter((col) => - topLevelTables.find((tbl) => tbl.designerId == col.designerId) + const topLevelColumns = (this.designer.columns || []).filter(col => + topLevelTables.find(tbl => tbl.designerId == col.designerId) ); - const selectIsGrouped = !!topLevelColumns.find((x) => x.isGrouped || (x.aggregate && x.aggregate != '---')); - const outputColumns = topLevelColumns.filter((x) => x.isOutput); + const selectIsGrouped = !!topLevelColumns.find(x => x.isGrouped || (x.aggregate && x.aggregate != '---')); + const outputColumns = topLevelColumns.filter(x => x.isOutput); if (outputColumns.length == 0) { res.selectAll = true; } else { - res.columns = outputColumns.map((col) => this.getColumnOutputExpression(col, selectIsGrouped)); + res.columns = outputColumns.map(col => this.getColumnOutputExpression(col, selectIsGrouped)); } - const groupedColumns = topLevelColumns.filter((x) => x.isGrouped); + const groupedColumns = topLevelColumns.filter(x => x.isGrouped); if (groupedColumns.length > 0) { - res.groupBy = groupedColumns.map((col) => ({ + res.groupBy = groupedColumns.map(col => ({ exprType: 'column', columnName: col.columnName, source: findQuerySource(this.designer, col.designerId), @@ -195,11 +195,11 @@ export class DesignerQueryDumper { } const orderColumns = _.sortBy( - topLevelColumns.filter((x) => x.sortOrder), - (x) => Math.abs(x.sortOrder) + topLevelColumns.filter(x => x.sortOrder), + x => Math.abs(x.sortOrder) ); if (orderColumns.length > 0) { - res.orderBy = orderColumns.map((col) => ({ + res.orderBy = orderColumns.map(col => ({ exprType: 'column', direction: col.sortOrder < 0 ? 'DESC' : 'ASC', columnName: col.columnName, diff --git a/packages/web/src/designer/DesignerReference.js b/packages/web/src/designer/DesignerReference.js index e1e33ea25..60a37bfdf 100644 --- a/packages/web/src/designer/DesignerReference.js +++ b/packages/web/src/designer/DesignerReference.js @@ -19,8 +19,8 @@ const StyledSvg = styled.svg` const ReferenceWrapper = styled.div` position: absolute; - border: 1px solid ${(props) => props.theme.designer_line}; - background-color: ${(props) => props.theme.designer_background}; + border: 1px solid ${props => props.theme.designer_line}; + background-color: ${props => props.theme.designer_background}; z-index: 900; border-radius: 10px; width: 32px; @@ -35,7 +35,7 @@ const ReferenceText = styled.span` transform: translate(-50%, -50%); z-index: 900; white-space: nowrap; - background-color: ${(props) => props.theme.designer_background}; + background-color: ${props => props.theme.designer_background}; `; function ReferenceContextMenu({ remove, setJoinType, isConnected }) { @@ -88,10 +88,10 @@ export default function DesignerReference({ possibilities.push({ xsrc: sourceRect.right + buswi, dirsrc: 1, xdst: targetRect.left - buswi, dirdst: -1 }); possibilities.push({ xsrc: sourceRect.right + buswi, dirsrc: 1, xdst: targetRect.right + buswi, dirdst: 1 }); - let minpos = _.minBy(possibilities, (p) => Math.abs(p.xsrc - p.xdst)); + let minpos = _.minBy(possibilities, p => Math.abs(p.xsrc - p.xdst)); - let srcY = _.mean(columns.map((x) => sourceTable.getColumnY(x.source))); - let dstY = _.mean(columns.map((x) => targetTable.getColumnY(x.target))); + let srcY = _.mean(columns.map(x => sourceTable.getColumnY(x.source))); + let dstY = _.mean(columns.map(x => targetTable.getColumnY(x.target))); if (columns.length == 0) { srcY = sourceTable.getColumnY(''); @@ -103,7 +103,7 @@ export default function DesignerReference({ const lineStyle = { fill: 'none', stroke: theme.designer_line, strokeWidth: 2 }; - const handleContextMenu = (event) => { + const handleContextMenu = event => { event.preventDefault(); showMenu( event.pageX, @@ -111,7 +111,7 @@ export default function DesignerReference({ onRemoveReference({ designerId })} isConnected={isConnectedByReference(designer, { designerId: sourceId }, { designerId: targetId }, reference)} - setJoinType={(joinType) => { + setJoinType={joinType => { onChangeReference({ ...reference, joinType, diff --git a/packages/web/src/designer/DesignerTable.js b/packages/web/src/designer/DesignerTable.js index d7e3142bd..e9b996aa7 100644 --- a/packages/web/src/designer/DesignerTable.js +++ b/packages/web/src/designer/DesignerTable.js @@ -15,20 +15,20 @@ import InputTextModal from '../modals/InputTextModal'; const Wrapper = styled.div` position: absolute; // background-color: white; - background-color: ${(props) => props.theme.designtable_background}; - border: 1px solid ${(props) => props.theme.border}; + background-color: ${props => props.theme.designtable_background}; + border: 1px solid ${props => props.theme.border}; `; const Header = styled.div` font-weight: bold; text-align: center; padding: 2px; - background: ${(props) => + background: ${props => // @ts-ignore props.objectTypeField == 'views' ? props.theme.designtable_background_magenta[2] : props.theme.designtable_background_blue[2]}; - border-bottom: 1px solid ${(props) => props.theme.border}; + border-bottom: 1px solid ${props => props.theme.border}; cursor: pointer; display: flex; justify-content: space-between; @@ -44,7 +44,7 @@ const ColumnsWrapper = styled.div` const HeaderLabel = styled.div``; const CloseWrapper = styled.div` - ${(props) => + ${props => ` background-color: ${props.theme.toolbar_background} ; @@ -63,7 +63,7 @@ const CloseWrapper = styled.div` // } const ColumnLine = styled.div` - ${(props) => + ${props => // @ts-ignore !props.isDragSource && // @ts-ignore @@ -74,14 +74,14 @@ const ColumnLine = styled.div` } `} - ${(props) => + ${props => // @ts-ignore props.isDragSource && ` background-color: ${props.theme.designtable_background_cyan[2]}; `} - ${(props) => + ${props => // @ts-ignore props.isDragTarget && ` @@ -113,7 +113,7 @@ function ColumnContextMenu({ setSortOrder, addReference }) { function ColumnDesignerIcons({ column, designerId, designer }) { const designerColumn = (designer.columns || []).find( - (x) => x.designerId == designerId && x.columnName == column.columnName + x => x.designerId == designerId && x.columnName == column.columnName ); if (!designerColumn) return null; return ( @@ -155,7 +155,7 @@ export default function DesignerTable({ const moveStartXRef = React.useRef(null); const moveStartYRef = React.useRef(null); - const handleMove = React.useCallback((e) => { + const handleMove = React.useCallback(e => { let diffX = e.clientX - moveStartXRef.current; let diffY = e.clientY - moveStartYRef.current; moveStartXRef.current = e.clientX; @@ -180,11 +180,11 @@ export default function DesignerTable({ const changeTokenDebounced = React.useRef( // @ts-ignore - _.debounce(() => setChangeToken((x) => x + 1), 100) + _.debounce(() => setChangeToken(x => x + 1), 100) ); const handleMoveEnd = React.useCallback( - (e) => { + e => { if (movingPositionRef.current) { onChangeTable({ ...table, @@ -217,7 +217,7 @@ export default function DesignerTable({ }, [movingPosition == null, handleMove, handleMoveEnd]); const headerMouseDown = React.useCallback( - (e) => { + e => { e.preventDefault(); moveStartXRef.current = e.clientX; moveStartYRef.current = e.clientY; @@ -235,13 +235,13 @@ export default function DesignerTable({ }; const handleSetTableAlias = () => { - showModal((modalState) => ( + showModal(modalState => ( { + onConfirm={newAlias => { onChangeTable({ ...table, alias: newAlias, @@ -251,7 +251,7 @@ export default function DesignerTable({ )); }; - const handleHeaderContextMenu = (event) => { + const handleHeaderContextMenu = event => { event.preventDefault(); showMenu( event.pageX, @@ -272,20 +272,20 @@ export default function DesignerTable({ ); }; - const handleColumnContextMenu = (column) => (event) => { + const handleColumnContextMenu = column => event => { event.preventDefault(); const foreignKey = findForeignKeyForColumn(table, column); showMenu( event.pageX, event.pageY, { + setSortOrder={sortOrder => { onChangeColumn( { ...column, designerId, }, - (col) => ({ ...col, sortOrder }) + col => ({ ...col, sortOrder }) ); }} addReference={ @@ -307,7 +307,7 @@ export default function DesignerTable({ top: movingPosition ? movingPosition.top : top, }} onMouseDown={() => onBringToFront(table)} - ref={(dom) => dispatchDomColumn('', dom)} + ref={dom => dispatchDomColumn('', dom)} >
- {(columns || []).map((column) => ( + {(columns || []).map(column => ( dispatchDomColumn(column.columnName, dom)} + ref={dom => dispatchDomColumn(column.columnName, dom)} // @ts-ignore isDragSource={ sourceDragColumn && @@ -341,7 +341,7 @@ export default function DesignerTable({ targetDragColumn.designerId == designerId && targetDragColumn.columnName == column.columnName } - onDragStart={(e) => { + onDragStart={e => { const dragData = { ...column, designerId, @@ -349,11 +349,11 @@ export default function DesignerTable({ setSourceDragColumn(dragData); e.dataTransfer.setData('designer_column_drag_data', JSON.stringify(dragData)); }} - onDragEnd={(e) => { + onDragEnd={e => { setTargetDragColumn(null); setSourceDragColumn(null); }} - onDragOver={(e) => { + onDragOver={e => { if (sourceDragColumn) { e.preventDefault(); setTargetDragColumn({ @@ -362,7 +362,7 @@ export default function DesignerTable({ }); } }} - onDrop={(e) => { + onDrop={e => { var data = e.dataTransfer.getData('designer_column_drag_data'); e.preventDefault(); if (!data) return; @@ -370,7 +370,7 @@ export default function DesignerTable({ setTargetDragColumn(null); setSourceDragColumn(null); }} - onMouseDown={(e) => + onMouseDown={e => onSelectColumn({ ...column, designerId, @@ -380,17 +380,17 @@ export default function DesignerTable({ x.designerId == designerId && x.columnName == column.columnName && x.isOutput + x => x.designerId == designerId && x.columnName == column.columnName && x.isOutput ) } - onChange={(e) => { + onChange={e => { if (e.target.checked) { onChangeColumn( { ...column, designerId, }, - (col) => ({ ...col, isOutput: true }) + col => ({ ...col, isOutput: true }) ); } else { onChangeColumn( @@ -398,7 +398,7 @@ export default function DesignerTable({ ...column, designerId, }, - (col) => ({ ...col, isOutput: false }) + col => ({ ...col, isOutput: false }) ); } }} diff --git a/packages/web/src/designer/DomTableRef.ts b/packages/web/src/designer/DomTableRef.ts index ca37a54ba..53aef90f0 100644 --- a/packages/web/src/designer/DomTableRef.ts +++ b/packages/web/src/designer/DomTableRef.ts @@ -1,4 +1,4 @@ -import { DesignerTableInfo } from "./types"; +import { DesignerTableInfo } from './types'; export default class DomTableRef { domTable: Element; diff --git a/packages/web/src/designer/QueryDesignColumns.js b/packages/web/src/designer/QueryDesignColumns.js index 6a90fd136..7ac113f96 100644 --- a/packages/web/src/designer/QueryDesignColumns.js +++ b/packages/web/src/designer/QueryDesignColumns.js @@ -6,7 +6,7 @@ import InlineButton from '../widgets/InlineButton'; import { findDesignerFilterType } from './designerTools'; function getTableDisplayName(column, tables) { - const table = (tables || []).find((x) => x.designerId == column.designerId); + const table = (tables || []).find(x => x.designerId == column.designerId); if (table) return table.alias || table.pureName; return ''; } @@ -15,10 +15,10 @@ export default function QueryDesignColumns({ value, onChange }) { const { columns, tables } = value || {}; const changeColumn = React.useCallback( - (col) => { - onChange((current) => ({ + col => { + onChange(current => ({ ...current, - columns: (current.columns || []).map((x) => + columns: (current.columns || []).map(x => x.designerId == col.designerId && x.columnName == col.columnName ? col : x ), })); @@ -27,30 +27,28 @@ export default function QueryDesignColumns({ value, onChange }) { ); const removeColumn = React.useCallback( - (col) => { - onChange((current) => ({ + col => { + onChange(current => ({ ...current, - columns: (current.columns || []).filter( - (x) => x.designerId != col.designerId || x.columnName != col.columnName - ), + columns: (current.columns || []).filter(x => x.designerId != col.designerId || x.columnName != col.columnName), })); }, [onChange] ); - const hasGroupedColumn = !!(columns || []).find((x) => x.isGrouped); + const hasGroupedColumn = !!(columns || []).find(x => x.isGrouped); return ( - getTableDisplayName(row, tables)} /> + getTableDisplayName(row, tables)} /> ( + formatter={row => ( { + onChange={e => { if (e.target.checked) changeColumn({ ...row, isOutput: true }); else changeColumn({ ...row, isOutput: false }); }} @@ -60,10 +58,10 @@ export default function QueryDesignColumns({ value, onChange }) { ( + formatter={row => ( { + onChange={e => { changeColumn({ ...row, alias: e.target.value }); }} /> @@ -73,10 +71,10 @@ export default function QueryDesignColumns({ value, onChange }) { ( + formatter={row => ( { + onChange={e => { if (e.target.checked) changeColumn({ ...row, isGrouped: true }); else changeColumn({ ...row, isGrouped: false }); }} @@ -86,11 +84,11 @@ export default function QueryDesignColumns({ value, onChange }) { + formatter={row => !row.isGrouped && ( { + onChange={e => { changeColumn({ ...row, aggregate: e.target.value }); }} > @@ -108,10 +106,10 @@ export default function QueryDesignColumns({ value, onChange }) { ( + formatter={row => ( { + onChange={e => { changeColumn({ ...row, sortOrder: parseInt(e.target.value) }); }} > @@ -128,11 +126,11 @@ export default function QueryDesignColumns({ value, onChange }) { ( + formatter={row => ( { + setFilter={filter => { changeColumn({ ...row, filter }); }} /> @@ -142,11 +140,11 @@ export default function QueryDesignColumns({ value, onChange }) { ( + formatter={row => ( { + setFilter={groupFilter => { changeColumn({ ...row, groupFilter }); }} /> @@ -156,7 +154,7 @@ export default function QueryDesignColumns({ value, onChange }) { ( + formatter={row => ( <> removeColumn(row)}>Remove diff --git a/packages/web/src/designer/cleanupDesignColumns.js b/packages/web/src/designer/cleanupDesignColumns.js index 758369ff9..171eefd50 100644 --- a/packages/web/src/designer/cleanupDesignColumns.js +++ b/packages/web/src/designer/cleanupDesignColumns.js @@ -1,5 +1,5 @@ export default function cleanupDesignColumns(columns) { return (columns || []).filter( - (x) => x.isOutput || x.isGrouped || x.alias || (x.aggregate && x.aggregate != '---') || x.sortOrder || x.filter + x => x.isOutput || x.isGrouped || x.alias || (x.aggregate && x.aggregate != '---') || x.sortOrder || x.filter ); } diff --git a/packages/web/src/designer/designerTools.ts b/packages/web/src/designer/designerTools.ts index a1061a1ff..5ed0152d8 100644 --- a/packages/web/src/designer/designerTools.ts +++ b/packages/web/src/designer/designerTools.ts @@ -12,9 +12,8 @@ export function referenceIsConnecting( tables2: DesignerTableInfo[] ) { return ( - (tables1.find((x) => x.designerId == reference.sourceId) && - tables2.find((x) => x.designerId == reference.targetId)) || - (tables1.find((x) => x.designerId == reference.targetId) && tables2.find((x) => x.designerId == reference.sourceId)) + (tables1.find(x => x.designerId == reference.sourceId) && tables2.find(x => x.designerId == reference.targetId)) || + (tables1.find(x => x.designerId == reference.targetId) && tables2.find(x => x.designerId == reference.sourceId)) ); } @@ -43,7 +42,7 @@ export function findConnectingReference( } export function findQuerySource(designer: DesignerInfo, designerId: string): Source { - const table = designer.tables.find((x) => x.designerId == designerId); + const table = designer.tables.find(x => x.designerId == designerId); if (!table) return null; return { name: table, @@ -71,14 +70,14 @@ export function mergeSelectsFromDesigner(select1: Select, select2: Select): Sele } export function findPrimaryTable(tables: DesignerTableInfo[]) { - return _.minBy(tables, (x) => x.top); + return _.minBy(tables, x => x.top); } export function getReferenceConditions(reference: DesignerReferenceInfo, designer: DesignerInfo): Condition[] { - const sourceTable = designer.tables.find((x) => x.designerId == reference.sourceId); - const targetTable = designer.tables.find((x) => x.designerId == reference.targetId); + const sourceTable = designer.tables.find(x => x.designerId == reference.sourceId); + const targetTable = designer.tables.find(x => x.designerId == reference.targetId); - return reference.columns.map((col) => ({ + return reference.columns.map(col => ({ conditionType: 'binary', operator: '=', left: { @@ -123,19 +122,19 @@ export function isConnectedByReference( const creator = new DesignerComponentCreator({ ...designer, references: withoutRef - ? designer.references.filter((x) => x.designerId != withoutRef.designerId) + ? designer.references.filter(x => x.designerId != withoutRef.designerId) : designer.references, }); - const arrays = creator.components.map((x) => x.thisAndSubComponentsTables); - const array1 = arrays.find((a) => a.find((x) => x.designerId == table1.designerId)); - const array2 = arrays.find((a) => a.find((x) => x.designerId == table2.designerId)); + const arrays = creator.components.map(x => x.thisAndSubComponentsTables); + const array1 = arrays.find(a => a.find(x => x.designerId == table1.designerId)); + const array2 = arrays.find(a => a.find(x => x.designerId == table2.designerId)); return array1 == array2; } export function findDesignerFilterType({ designerId, columnName }, designer) { - const table = (designer.tables || []).find((x) => x.designerId == designerId); + const table = (designer.tables || []).find(x => x.designerId == designerId); if (table) { - const column = (table.columns || []).find((x) => x.columnName == columnName); + const column = (table.columns || []).find(x => x.columnName == columnName); if (column) { const { dataType } = column; return getFilterType(dataType); diff --git a/packages/web/src/formview/ChangeSetFormer.ts b/packages/web/src/formview/ChangeSetFormer.ts index 739ce111c..11716145c 100644 --- a/packages/web/src/formview/ChangeSetFormer.ts +++ b/packages/web/src/formview/ChangeSetFormer.ts @@ -28,7 +28,7 @@ export default class ChangeSetFormer extends Former { ) { super(); this.changeSet = changeSetState && changeSetState.value; - this.setChangeSet = (value) => dispatchChangeSet({ type: 'set', value }); + this.setChangeSet = value => dispatchChangeSet({ type: 'set', value }); this.batchChangeSet = null; this.rowDefinition = display.getChangeSetRow(sourceRow); const [matchedField, matchedChangeSetItem] = findExistingChangeSetItem(this.changeSet, this.rowDefinition); @@ -51,14 +51,14 @@ export default class ChangeSetFormer extends Former { } } - setCellValue( uniqueName: string, value: any) { + setCellValue(uniqueName: string, value: any) { const row = this.sourceRow; const definition = this.display.getChangeSetField(row, uniqueName); - this.applyModification((chs) => setChangeSetValue(chs, definition, value)); + this.applyModification(chs => setChangeSetValue(chs, definition, value)); } deleteRow(index: number) { - this.applyModification((chs) => deleteChangeSetRows(chs, this.rowDefinition)); + this.applyModification(chs => deleteChangeSetRows(chs, this.rowDefinition)); } beginUpdate() { @@ -70,10 +70,10 @@ export default class ChangeSetFormer extends Former { } revertRowChanges() { - this.applyModification((chs) => revertChangeSetRowChanges(chs, this.rowDefinition)); + this.applyModification(chs => revertChangeSetRowChanges(chs, this.rowDefinition)); } revertAllChanges() { - this.applyModification((chs) => createChangeSet()); + this.applyModification(chs => createChangeSet()); } undo() { this.dispatchChangeSet({ type: 'undo' }); diff --git a/packages/web/src/formview/FormView.js b/packages/web/src/formview/FormView.js index 4f4bae68c..aa59851ab 100644 --- a/packages/web/src/formview/FormView.js +++ b/packages/web/src/formview/FormView.js @@ -37,24 +37,24 @@ const Wrapper = styled.div` `; const TableRow = styled.tr` - background-color: ${(props) => props.theme.gridbody_background}; + background-color: ${props => props.theme.gridbody_background}; &:nth-child(6n + 3) { - background-color: ${(props) => props.theme.gridbody_background_alt2}; + background-color: ${props => props.theme.gridbody_background_alt2}; } &:nth-child(6n + 6) { - background-color: ${(props) => props.theme.gridbody_background_alt3}; + background-color: ${props => props.theme.gridbody_background_alt3}; } `; const TableHeaderCell = styled.td` - border: 1px solid ${(props) => props.theme.border}; + border: 1px solid ${props => props.theme.border}; text-align: left; padding: 2px; - background-color: ${(props) => props.theme.gridheader_background}; + background-color: ${props => props.theme.gridheader_background}; overflow: hidden; position: relative; - ${(props) => + ${props => props.isSelected && ` background: initial; @@ -64,7 +64,7 @@ const TableHeaderCell = styled.td` const TableBodyCell = styled.td` font-weight: normal; - border: 1px solid ${(props) => props.theme.border}; + border: 1px solid ${props => props.theme.border}; // border-collapse: collapse; padding: 2px; white-space: nowrap; @@ -73,14 +73,14 @@ const TableBodyCell = styled.td` overflow: hidden; text-overflow: ellipsis; - ${(props) => + ${props => props.isSelected && ` background: initial; background-color: ${props.theme.gridbody_selection[4]}; color: ${props.theme.gridbody_invfont1};`} - ${(props) => + ${props => !props.isSelected && props.isModifiedCell && ` @@ -96,7 +96,7 @@ const FocusField = styled.input` const RowCountLabel = styled.div` position: absolute; - background-color: ${(props) => props.theme.gridbody_background_yellow[1]}; + background-color: ${props => props.theme.gridbody_background_yellow[1]}; right: 40px; bottom: 20px; `; @@ -145,7 +145,7 @@ export default function FormView(props) { const { rowData, rowStatus } = former; const handleSwitchToTable = () => { - setConfig((cfg) => ({ + setConfig(cfg => ({ ...cfg, isFormView: false, formViewKey: null, @@ -156,7 +156,7 @@ export default function FormView(props) { ? () => formDisplay.filterCellValue(getCellColumn(currentCell), rowData) : null; - const handleContextMenu = (event) => { + const handleContextMenu = event => { event.preventDefault(); showMenu( event.pageX, @@ -196,7 +196,7 @@ export default function FormView(props) { return [row, col]; }; - const handleCursorMove = (event) => { + const handleCursorMove = event => { if (event.ctrlKey) { switch (event.keyCode) { case keycodes.leftArrow: @@ -225,7 +225,7 @@ export default function FormView(props) { } }; - const handleKeyNavigation = (event) => { + const handleKeyNavigation = event => { if (event.ctrlKey) { switch (event.keyCode) { case keycodes.upArrow: @@ -268,7 +268,7 @@ export default function FormView(props) { } } - const scrollIntoView = (cell) => { + const scrollIntoView = cell => { const element = cellRefs.current[`${cell[0]},${cell[1]}`]; if (element) element.scrollIntoView(); }; @@ -290,7 +290,7 @@ export default function FormView(props) { copyTextToClipboard(text); } - const handleKeyDown = (event) => { + const handleKeyDown = event => { const navigation = handleKeyNavigation(event); if (navigation) { event.preventDefault(); @@ -374,7 +374,7 @@ export default function FormView(props) { } }; - const handleTableMouseDown = (event) => { + const handleTableMouseDown = event => { event.preventDefault(); if (focusFieldRef.current) focusFieldRef.current.focus(); @@ -478,7 +478,7 @@ export default function FormView(props) { data-col={chunkIndex * 2} // @ts-ignore isSelected={currentCell[0] == rowIndex && currentCell[1] == chunkIndex * 2} - ref={(element) => setCellRef(rowIndex, chunkIndex * 2, element)} + ref={element => setCellRef(rowIndex, chunkIndex * 2, element)} > @@ -489,7 +489,7 @@ export default function FormView(props) { // @ts-ignore isSelected={currentCell[0] == rowIndex && currentCell[1] == chunkIndex * 2 + 1} isModifiedCell={rowStatus.modifiedFields && rowStatus.modifiedFields.has(col.uniqueName)} - ref={(element) => setCellRef(rowIndex, chunkIndex * 2 + 1, element)} + ref={element => setCellRef(rowIndex, chunkIndex * 2 + 1, element)} > {inplaceEditorState.cell && rowIndex == inplaceEditorState.cell[0] && @@ -499,7 +499,7 @@ export default function FormView(props) { inplaceEditorState={inplaceEditorState} dispatchInsplaceEditor={dispatchInsplaceEditor} cellValue={rowData[col.uniqueName]} - onSetValue={(value) => { + onSetValue={value => { former.setCellValue(col.uniqueName, value); }} // grider={grider} @@ -520,7 +520,7 @@ export default function FormView(props) { { + onClick={e => { e.stopPropagation(); openReferenceForm(rowData, col, openNewTab, conid, database); }} diff --git a/packages/web/src/formview/FormViewFilters.js b/packages/web/src/formview/FormViewFilters.js index 7ad5f429d..96e07124c 100644 --- a/packages/web/src/formview/FormViewFilters.js +++ b/packages/web/src/formview/FormViewFilters.js @@ -44,7 +44,7 @@ function PrimaryKeyFilterEditor({ column, baseTable, formDisplay }) { formDisplay.reload(); }; - const handleKeyDown = (ev) => { + const handleKeyDown = ev => { if (ev.keyCode == keycodes.enter) { applyFilter(); } @@ -58,13 +58,10 @@ function PrimaryKeyFilterEditor({ column, baseTable, formDisplay }) {
- x.columnName == column.columnName)} /> + x.columnName == column.columnName)} />
{formDisplay.config.formViewKeyRequested && ( - + )} @@ -86,11 +83,11 @@ export default function FormViewFilters(props) { return ( - {baseTable.primaryKey.columns.map((col) => ( + {baseTable.primaryKey.columns.map(col => ( ))} - {allFilterNames.map((columnName) => { - const column = baseTable.columns.find((x) => x.columnName == columnName); + {allFilterNames.map(columnName => { + const column = baseTable.columns.find(x => x.columnName == columnName); if (!column) return null; return ( @@ -108,7 +105,7 @@ export default function FormViewFilters(props) { formDisplay.setFilter(column.columnName, value)} + setFilter={value => formDisplay.setFilter(column.columnName, value)} /> ); diff --git a/packages/web/src/formview/SqlFormView.js b/packages/web/src/formview/SqlFormView.js index df8a60ba7..bc1f6ea66 100644 --- a/packages/web/src/formview/SqlFormView.js +++ b/packages/web/src/formview/SqlFormView.js @@ -84,12 +84,12 @@ export default function SqlFormView(props) { if (isLoadingData) return; let newLoadedRow = false; if (formDisplay.config.formViewKeyRequested || formDisplay.config.formViewKey) { - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoadingData: true, })); const row = await loadRow(props, formDisplay.getCurrentRowQuery()); - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoadingData: false, isLoadedData: true, @@ -107,14 +107,14 @@ export default function SqlFormView(props) { }; const handleLoadRowCount = async () => { - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoadingCount: true, })); const countRow = await loadRow(props, formDisplay.getCountQuery()); const countBeforeRow = await loadRow(props, formDisplay.getBeforeCountQuery()); - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoadedCount: true, isLoadingCount: false, @@ -123,8 +123,8 @@ export default function SqlFormView(props) { })); }; - const handleNavigate = async (command) => { - setLoadProps((oldLoadProps) => ({ + const handleNavigate = async command => { + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoadingData: true, })); @@ -132,7 +132,7 @@ export default function SqlFormView(props) { if (row) { formDisplay.navigate(row); } - setLoadProps((oldLoadProps) => ({ + setLoadProps(oldLoadProps => ({ ...oldLoadProps, isLoadingData: false, isLoadedData: true, @@ -227,7 +227,7 @@ export default function SqlFormView(props) { }); const { errorMessage } = resp.data || {}; if (errorMessage) { - showModal((modalState) => ( + showModal(modalState => ( )); } else { diff --git a/packages/web/src/freetable/FreeTableColumnEditor.js b/packages/web/src/freetable/FreeTableColumnEditor.js index fccc7a81b..334f2566c 100644 --- a/packages/web/src/freetable/FreeTableColumnEditor.js +++ b/packages/web/src/freetable/FreeTableColumnEditor.js @@ -14,7 +14,7 @@ const Row = styled.div` // padding: 5px; cursor: pointer; &:hover { - background-color: ${(props) => props.theme.manager_background_blue[1]}; + background-color: ${props => props.theme.manager_background_blue[1]}; } `; const Name = styled.div` @@ -29,13 +29,13 @@ const Icon = styled(FontIcon)` position: relative; top: 5px; &:hover { - background-color: ${(props) => props.theme.manager_background3}; + background-color: ${props => props.theme.manager_background3}; } padding: 5px; `; const EditorInput = styled.input` width: calc(100% - 10px); - background-color: ${(props) => + background-color: ${props => // @ts-ignore props.isError ? props.theme.manager_background_red[1] : props.theme.manager_background}; `; @@ -53,7 +53,7 @@ function ColumnNameEditor({ const [value, setValue] = React.useState(defaultValue || ''); const editorRef = React.useRef(null); const isError = value && existingNames && existingNames.includes(value); - const handleKeyDown = (event) => { + const handleKeyDown = event => { if (value && event.keyCode == keycodes.enter && !isError) { onEnter(value); setValue(''); @@ -82,7 +82,7 @@ function ColumnNameEditor({ onKeyDown={handleKeyDown} onBlur={handleBlur} value={value} - onChange={(ev) => setValue(ev.target.value)} + onChange={ev => setValue(ev.target.value)} // @ts-ignore isError={isError} {...other} @@ -141,17 +141,17 @@ export default function FreeTableColumnEditor(props) { index == editingColumn ? ( { + onEnter={columnName => { dispatchChangeColumns( props, - (cols) => cols.map((col, i) => (index == i ? { columnName } : col)), - (row) => _.mapKeys(row, (v, k) => (k == column.columnName ? columnName : k)) + cols => cols.map((col, i) => (index == i ? { columnName } : col)), + row => _.mapKeys(row, (v, k) => (k == column.columnName ? columnName : k)) ); }} onBlur={() => setEditingColumn(null)} focusOnCreate blurOnEnter - existingNames={model.structure.columns.map((x) => x.columnName)} + existingNames={model.structure.columns.map(x => x.columnName)} /> ) : ( setEditingColumn(index)} onRemove={() => { - dispatchChangeColumns(props, (cols) => cols.filter((c, i) => i != index)); + dispatchChangeColumns(props, cols => cols.filter((c, i) => i != index)); }} onUp={() => { - dispatchChangeColumns(props, (cols) => exchange(cols, index, index - 1)); + dispatchChangeColumns(props, cols => exchange(cols, index, index - 1)); }} onDown={() => { - dispatchChangeColumns(props, (cols) => exchange(cols, index, index + 1)); + dispatchChangeColumns(props, cols => exchange(cols, index, index + 1)); }} /> ) )} { - dispatchChangeColumns(props, (cols) => [...cols, { columnName }]); + onEnter={columnName => { + dispatchChangeColumns(props, cols => [...cols, { columnName }]); }} placeholder="New column" - existingNames={model.structure.columns.map((x) => x.columnName)} + existingNames={model.structure.columns.map(x => x.columnName)} /> diff --git a/packages/web/src/freetable/FreeTableGrid.js b/packages/web/src/freetable/FreeTableGrid.js index 10960e457..33524ae40 100644 --- a/packages/web/src/freetable/FreeTableGrid.js +++ b/packages/web/src/freetable/FreeTableGrid.js @@ -12,7 +12,7 @@ import WidgetColumnBar, { WidgetColumnBarItem } from '../widgets/WidgetColumnBar import useTheme from '../theme/useTheme'; const LeftContainer = styled.div` - background-color: ${(props) => props.theme.manager_background}; + background-color: ${props => props.theme.manager_background}; display: flex; flex: 1; `; @@ -25,7 +25,7 @@ const DataGridContainer = styled.div` function extractMacroValuesForMacro(macroValues, macro) { if (!macro) return {}; return { - ..._.fromPairs((macro.args || []).filter((x) => x.default != null).map((x) => [x.name, x.default])), + ..._.fromPairs((macro.args || []).filter(x => x.default != null).map(x => [x.name, x.default])), ..._.mapKeys(macroValues, (v, k) => k.replace(/^.*#/, '')), }; } diff --git a/packages/web/src/freetable/FreeTableGridCore.js b/packages/web/src/freetable/FreeTableGridCore.js index d9c854c8a..7f518a2bf 100644 --- a/packages/web/src/freetable/FreeTableGridCore.js +++ b/packages/web/src/freetable/FreeTableGridCore.js @@ -47,18 +47,18 @@ export default function FreeTableGridCore(props) { initialValues.sourceStorageType = 'jsldata'; initialValues.sourceJslId = jslid; initialValues.sourceList = ['editor-data']; - showModal((modalState) => ); + showModal(modalState => ); } const handleSelectionChanged = React.useCallback( - (cells) => { + cells => { if (onSelectionChanged) onSelectionChanged(cells); setSelectedCells(cells); }, [setSelectedCells] ); - const handleKeyDown = React.useCallback((event) => { + const handleKeyDown = React.useCallback(event => { if (event.keyCode == keycodes.escape) { setSelectedMacro(null); } diff --git a/packages/web/src/freetable/MacroDetail.js b/packages/web/src/freetable/MacroDetail.js index fb3b6c9ff..ac222d204 100644 --- a/packages/web/src/freetable/MacroDetail.js +++ b/packages/web/src/freetable/MacroDetail.js @@ -19,8 +19,8 @@ const Container = styled.div` height: ${dimensions.toolBar.height}px; min-height: ${dimensions.toolBar.height}px; overflow: hidden; - border-top: 1px solid ${(props) => props.theme.border}; - border-bottom: 1px solid ${(props) => props.theme.border}; + border-top: 1px solid ${props => props.theme.border}; + border-bottom: 1px solid ${props => props.theme.border}; `; const Header = styled.div` diff --git a/packages/web/src/freetable/MacroManager.js b/packages/web/src/freetable/MacroManager.js index c123e4ae5..cbd288c52 100644 --- a/packages/web/src/freetable/MacroManager.js +++ b/packages/web/src/freetable/MacroManager.js @@ -25,12 +25,12 @@ export default function MacroManager({ managerSize, selectedMacro, setSelectedMa setSelectedMacro(macro)} - getCommonProps={(data) => ({ + onObjectClick={macro => setSelectedMacro(macro)} + getCommonProps={data => ({ isBold: selectedMacro && selectedMacro.name == data.name, })} filter={filter} - groupFunc={(data) => data.group} + groupFunc={data => data.group} /> {/* {macros.map((macro) => ( diff --git a/packages/web/src/freetable/MacroParameters.js b/packages/web/src/freetable/MacroParameters.js index e1654507d..30ad8f885 100644 --- a/packages/web/src/freetable/MacroParameters.js +++ b/packages/web/src/freetable/MacroParameters.js @@ -6,7 +6,7 @@ import { FormProvider } from '../utility/FormProvider'; export default function MacroParameters({ args, onChangeValues, macroValues, namePrefix }) { if (!args || args.length == 0) return null; const initialValues = { - ..._.fromPairs(args.filter((x) => x.default != null).map((x) => [`${namePrefix}${x.name}`, x.default])), + ..._.fromPairs(args.filter(x => x.default != null).map(x => [`${namePrefix}${x.name}`, x.default])), ...macroValues, }; return ( diff --git a/packages/web/src/impexp/ImportExportConfigurator.js b/packages/web/src/impexp/ImportExportConfigurator.js index d7d7050c3..b575c0deb 100644 --- a/packages/web/src/impexp/ImportExportConfigurator.js +++ b/packages/web/src/impexp/ImportExportConfigurator.js @@ -53,7 +53,7 @@ const Column = styled.div` const Label = styled.div` margin: 5px; margin-top: 15px; - color: ${(props) => props.theme.modal_font2}; + color: ${props => props.theme.modal_font2}; `; const SourceNameWrapper = styled.div` @@ -67,10 +67,10 @@ const SourceNameButtons = styled.div` const IconButtonWrapper = styled.div` &:hover { - background-color: ${(props) => props.theme.modal_background2}; + background-color: ${props => props.theme.modal_background2}; } cursor: pointer; - color: ${(props) => props.theme.modal_font_blue[7]}; + color: ${props => props.theme.modal_font_blue[7]}; margin-left: 5px; `; @@ -82,12 +82,12 @@ const SqlWrapper = styled.div` const DragWrapper = styled.div` padding: 10px; - background: ${(props) => props.theme.modal_background2}; + background: ${props => props.theme.modal_background2}; `; const ArrowWrapper = styled.div` font-size: 30px; - color: ${(props) => props.theme.modal_font_blue[7]}; + color: ${props => props.theme.modal_font_blue[7]}; align-self: center; `; @@ -128,7 +128,7 @@ async function addFilesToSourceList(extensions, files, values, setValues, prefer await (format.addFileToSourceList || addFileToSourceListDefault)(file, newSources, newValues); } } - newValues['sourceList'] = [...(values.sourceList || []).filter((x) => !newSources.includes(x)), ...newSources]; + newValues['sourceList'] = [...(values.sourceList || []).filter(x => !newSources.includes(x)), ...newSources]; if (preferedStorageType && preferedStorageType != values.sourceStorageType) { newValues['sourceStorageType'] = preferedStorageType; } @@ -158,7 +158,7 @@ function ElectronFilesInput() { setIsLoading(true); await addFilesToSourceList( extensions, - files.map((full) => ({ + files.map(full => ({ fileName: full, shortName: path.parse(full).name, })), @@ -197,7 +197,7 @@ function FilesInput({ setPreviewSource = undefined }) { const showModal = useShowModal(); const { values, setValues } = useForm(); const extensions = useExtensions(); - const doAddUrl = (url) => { + const doAddUrl = url => { addFilesToSourceList( extensions, [ @@ -214,7 +214,7 @@ function FilesInput({ setPreviewSource = undefined }) { ); }; const handleAddUrl = () => - showModal((modalState) => ); + showModal(modalState => ); return ( <> @@ -245,7 +245,7 @@ function SourceTargetConfig({ ? [{ value: 'jsldata', label: 'Query result data', directions: ['source'] }] : [ { value: 'database', label: 'Database', directions: ['source', 'target'] }, - ...extensions.fileFormats.map((format) => ({ + ...extensions.fileFormats.map(format => ({ value: format.storageType, label: `${format.name} files(s)`, directions: getFileFormatDirections(format), @@ -269,7 +269,7 @@ function SourceTargetConfig({ Target configuration )} - x.directions.includes(direction))} name={storageTypeField} /> + x.directions.includes(direction))} name={storageTypeField} /> {(storageType == 'database' || storageType == 'query') && ( <> @@ -298,7 +298,7 @@ function SourceTargetConfig({ onClick={() => setFieldValue( 'sourceList', - _.uniq([...(values.sourceList || []), ...(dbinfo && dbinfo.tables.map((x) => x.pureName))]) + _.uniq([...(values.sourceList || []), ...(dbinfo && dbinfo.tables.map(x => x.pureName))]) ) } /> @@ -308,7 +308,7 @@ function SourceTargetConfig({ onClick={() => setFieldValue( 'sourceList', - _.uniq([...(values.sourceList || []), ...(dbinfo && dbinfo.views.map((x) => x.pureName))]) + _.uniq([...(values.sourceList || []), ...(dbinfo && dbinfo.views.map(x => x.pureName))]) ) } /> @@ -324,7 +324,7 @@ function SourceTargetConfig({ setFieldValue('sourceSql', value)} + onChange={value => setFieldValue('sourceSql', value)} engine={engine} focusOnCreate /> @@ -353,7 +353,7 @@ function SourceTargetConfig({ onClick={() => setFieldValue( 'sourceList', - _.uniq([...(values.sourceList || []), ...(archiveFiles && archiveFiles.map((x) => x.name))]) + _.uniq([...(values.sourceList || []), ...(archiveFiles && archiveFiles.map(x => x.name))]) ) } /> @@ -366,7 +366,7 @@ function SourceTargetConfig({ {format && format.args && ( !arg.direction || arg.direction == direction)} + args={format.args.filter(arg => !arg.direction || arg.direction == direction)} namePrefix={`${direction}_${format.storageType}_`} /> )} @@ -382,14 +382,14 @@ function SourceName({ name }) { const handleDelete = () => { setFieldValue( 'sourceList', - values.sourceList.filter((x) => x != name) + values.sourceList.filter(x => x != name) ); }; - const doChangeUrl = (url) => { + const doChangeUrl = url => { setFieldValue(`sourceFile_${name}`, { fileName: url, isDownload: true }); }; const handleChangeUrl = () => { - showModal((modalState) => ( + showModal(modalState => ( )); }; @@ -423,7 +423,7 @@ export default function ImportExportConfigurator({ uploadedFile = undefined, onC const extensions = useExtensions(); const handleUpload = React.useCallback( - (file) => { + file => { addFilesToSourceList( extensions, [ @@ -516,36 +516,36 @@ export default function ImportExportConfigurator({ uploadedFile = undefined, onC Map source tables/files - } /> + } /> ( + formatter={row => ( setFieldValue(`actionType_${row}`, e.target.value)} + onChange={e => setFieldValue(`actionType_${row}`, e.target.value)} /> )} /> ( + formatter={row => ( setFieldValue(`targetName_${row}`, e.target.value)} + onChange={e => setFieldValue(`targetName_${row}`, e.target.value)} /> )} /> + formatter={row => supportsPreview ? ( { + onChange={e => { if (e.target.checked) setPreviewSource(row); else setPreviewSource(null); }} diff --git a/packages/web/src/impexp/ScriptWriter.js b/packages/web/src/impexp/ScriptWriter.js index 68e987c87..faf33f909 100644 --- a/packages/web/src/impexp/ScriptWriter.js +++ b/packages/web/src/impexp/ScriptWriter.js @@ -39,7 +39,7 @@ export default class ScriptWriter { getScript(schedule = null) { const packageNames = this.packageNames; let prefix = _.uniq(packageNames) - .map((packageName) => `// @require ${packageName}\n`) + .map(packageName => `// @require ${packageName}\n`) .join(''); if (schedule) prefix += `// @schedule ${schedule}`; if (prefix) prefix += '\n'; diff --git a/packages/web/src/index.css b/packages/web/src/index.css index 6f6c81061..d420fc1f7 100644 --- a/packages/web/src/index.css +++ b/packages/web/src/index.css @@ -25,4 +25,4 @@ code { .icon-invisible { visibility: hidden; -} \ No newline at end of file +} diff --git a/packages/web/src/modals/ChangeDownloadUrlModal.js b/packages/web/src/modals/ChangeDownloadUrlModal.js index 716db3d6b..ce0b08e70 100644 --- a/packages/web/src/modals/ChangeDownloadUrlModal.js +++ b/packages/web/src/modals/ChangeDownloadUrlModal.js @@ -19,7 +19,7 @@ export default function ChangeDownloadUrlModal({ modalState, url = '', onConfirm // }; const handleSubmit = React.useCallback( - async (values) => { + async values => { onConfirm(values.url); modalState.close(); }, diff --git a/packages/web/src/modals/ConnectionModal.js b/packages/web/src/modals/ConnectionModal.js index 15c1b3329..96c79db3a 100644 --- a/packages/web/src/modals/ConnectionModal.js +++ b/packages/web/src/modals/ConnectionModal.js @@ -14,10 +14,10 @@ import { FormProvider, useForm } from '../utility/FormProvider'; function DriverFields({ extensions }) { const { values, setFieldValue } = useForm(); const { authType, engine } = values; - const driver = extensions.drivers.find((x) => x.engine == engine); + const driver = extensions.drivers.find(x => x.engine == engine); // const { authTypes } = driver || {}; const [authTypes, setAuthTypes] = React.useState(null); - const currentAuthType = authTypes && authTypes.find((x) => x.name == authType); + const currentAuthType = authTypes && authTypes.find(x => x.name == authType); const loadAuthTypes = async () => { const resp = await axios.post('plugins/auth-types', { engine }); @@ -39,7 +39,7 @@ function DriverFields({ extensions }) { <> {!!authTypes && ( - {authTypes.map((auth) => ( + {authTypes.map(auth => ( @@ -66,7 +66,7 @@ export default function ConnectionModal({ modalState, connection = undefined }) const [isTesting, setIsTesting] = React.useState(false); const testIdRef = React.useRef(0); - const handleTest = async (values) => { + const handleTest = async values => { setIsTesting(true); testIdRef.current += 1; const testid = testIdRef.current; @@ -82,7 +82,7 @@ export default function ConnectionModal({ modalState, connection = undefined }) setIsTesting(false); }; - const handleSubmit = async (values) => { + const handleSubmit = async values => { axios.post('connections/save', values); modalState.close(); }; @@ -93,7 +93,7 @@ export default function ConnectionModal({ modalState, connection = undefined }) - {extensions.drivers.map((driver) => ( + {extensions.drivers.map(driver => ( diff --git a/packages/web/src/modals/CreateDatabaseModal.js b/packages/web/src/modals/CreateDatabaseModal.js index c8c1632b4..bb7aed9cf 100644 --- a/packages/web/src/modals/CreateDatabaseModal.js +++ b/packages/web/src/modals/CreateDatabaseModal.js @@ -8,7 +8,7 @@ import ModalFooter from './ModalFooter'; import { FormProvider } from '../utility/FormProvider'; export default function CreateDatabaseModal({ modalState, conid }) { - const handleSubmit = async (values) => { + const handleSubmit = async values => { const { name } = values; axios.post('server-connections/create-database', { conid, name }); diff --git a/packages/web/src/modals/FavoriteModal.js b/packages/web/src/modals/FavoriteModal.js index 20e526ece..6594e7134 100644 --- a/packages/web/src/modals/FavoriteModal.js +++ b/packages/web/src/modals/FavoriteModal.js @@ -48,7 +48,7 @@ export default function FavoriteModal({ modalState, editingData = undefined, sav const canWriteFavorite = hasPermission('files/favorites/write'); - const getTabSaveData = async (values) => { + const getTabSaveData = async values => { const tabdata = {}; const skipEditor = !!savedFile && values.whatToSave != 'content'; @@ -78,7 +78,7 @@ export default function FavoriteModal({ modalState, editingData = undefined, sav }; }; - const saveTab = async (values) => { + const saveTab = async values => { const data = await getTabSaveData(values); axios.post('files/save', { @@ -89,7 +89,7 @@ export default function FavoriteModal({ modalState, editingData = undefined, sav }); }; - const saveFile = async (values) => { + const saveFile = async values => { const oldDataResp = await axios.post('files/load', { folder: 'favorites', file: editingData.file, @@ -107,7 +107,7 @@ export default function FavoriteModal({ modalState, editingData = undefined, sav }); }; - const handleSubmit = async (values) => { + const handleSubmit = async values => { modalState.close(); if (savingTab) { saveTab(values); @@ -117,7 +117,7 @@ export default function FavoriteModal({ modalState, editingData = undefined, sav } }; - const handleCopyLink = async (values) => { + const handleCopyLink = async values => { const tabdata = await getTabSaveData(values); copyTextToClipboard(`${document.location.origin}#tabdata=${encodeURIComponent(JSON.stringify(tabdata))}`); }; @@ -136,7 +136,7 @@ export default function FavoriteModal({ modalState, editingData = undefined, sav {!!savingTab && !electron && canWriteFavorite && ( )} - !values.shareAsLink && canWriteFavorite}> + !values.shareAsLink && canWriteFavorite}> @@ -148,10 +148,10 @@ export default function FavoriteModal({ modalState, editingData = undefined, sav )} - !values.shareAsLink && canWriteFavorite}> + !values.shareAsLink && canWriteFavorite}> - values.shareAsLink || !canWriteFavorite}> + values.shareAsLink || !canWriteFavorite}> modalState.close()} /> diff --git a/packages/web/src/modals/FilterMultipleValuesModal.js b/packages/web/src/modals/FilterMultipleValuesModal.js index 9649b96f3..bc41a69c9 100644 --- a/packages/web/src/modals/FilterMultipleValuesModal.js +++ b/packages/web/src/modals/FilterMultipleValuesModal.js @@ -49,7 +49,7 @@ export default function FilterMultipleValuesModal({ modalState, onFilter }) { Filter multiple values -