IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2025-02-25 18:55:31 -06:00
Code Issues Packages Projects Releases Wiki Activity

Port the remaining components of the ERD Tool to React. Fixes #7343

Browse Source 
1. Make use of MUI styles and remove SCSS.
2. Use the new common components for buttons and tooltips, so that they are consistent.
3. UI design should be aligned with the query tool.
4. Remove tippyjs and Alertify dependencies.
This commit is contained in:
Aditya Toshniwal
2022-09-06 18:09:13 +05:30
committed by Akshay Joshi
parent 1d0ac0f7dc
commit 0f46f070ed
64 changed files with 1451 additions and 1757 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/pgadmin/tools/sqleditor/static/js/SQLEditorModule.js
View File

@@ -16,7 +16,6 @@ import $ from 'jquery';
import url_for from 'sources/url_for';
import _ from 'lodash';
import alertify from 'pgadmin.alertifyjs';
var wcDocker = window.wcDocker;
import pgWindow from 'sources/window';
import pgAdmin from 'sources/pgadmin';
import pgBrowser from 'pgadmin.browser';
@@ -29,6 +28,7 @@ import QueryToolComponent from './components/QueryToolComponent';
import ModalProvider from '../../../../static/js/helpers/ModalProvider';
import Theme from '../../../../static/js/Theme';
const wcDocker = window.wcDocker;
export function setPanelTitle(queryToolPanel, panelTitle) {
queryToolPanel.title('<span title="'+panelTitle+'">'+panelTitle+'</span>');

39
web/pgadmin/tools/sqleditor/static/js/components/dialogs/ConfirmSaveContent.jsx
View File

@@ -1,39 +0,0 @@
import React from 'react';
import { useModalStyles } from '../../../../../../static/js/helpers/ModalProvider';
import gettext from 'sources/gettext';
import { Box } from '@material-ui/core';
import { DefaultButton, PrimaryButton } from '../../../../../../static/js/components/Buttons';
import CloseIcon from '@material-ui/icons/CloseRounded';
import CheckRoundedIcon from '@material-ui/icons/CheckRounded';
import DeleteRoundedIcon from '@material-ui/icons/DeleteRounded';
import HTMLReactParser from 'html-react-parser';
import PropTypes from 'prop-types';
export default function ConfirmSaveContent({closeModal, text, onDontSave, onSave}) {
const classes = useModalStyles();
return (
<Box display="flex" flexDirection="column" height="100%">
<Box flexGrow="1" p={2}>{typeof(text) == 'string' ? HTMLReactParser(text) : text}</Box>
<Box className={classes.footer}>
<DefaultButton data-test="close" startIcon={<CloseIcon />} onClick={()=>{
closeModal();
}} >{gettext('Cancel')}</DefaultButton>
<DefaultButton data-test="dont-save" className={classes.margin} startIcon={<DeleteRoundedIcon />} onClick={()=>{
onDontSave?.();
closeModal();
}} >{gettext('Don\'t save')}</DefaultButton>
<PrimaryButton data-test="save" className={classes.margin} startIcon={<CheckRoundedIcon />} onClick={()=>{
onSave?.();
closeModal();
}} autoFocus={true} >{gettext('Save')}</PrimaryButton>
</Box>
</Box>
);
}
ConfirmSaveContent.propTypes = {
closeModal: PropTypes.func,
text: PropTypes.string,
onDontSave: PropTypes.func,
onSave: PropTypes.func
};

2
web/pgadmin/tools/sqleditor/static/js/components/sections/Query.jsx
View File

@@ -13,7 +13,7 @@ import CodeMirror from '../../../../../../static/js/components/CodeMirror';
import {PANELS, QUERY_TOOL_EVENTS} from '../QueryToolConstants';
import url_for from 'sources/url_for';
import { LayoutEventsContext, LAYOUT_EVENTS } from '../../../../../../static/js/helpers/Layout';
import ConfirmSaveContent from '../dialogs/ConfirmSaveContent';
import ConfirmSaveContent from '../../../../../../static/js/Dialogs/ConfirmSaveContent';
import gettext from 'sources/gettext';
import OrigCodeMirror from 'bundled_codemirror';
import Notifier from '../../../../../../static/js/helpers/Notifier';

2
web/pgadmin/tools/sqleditor/static/js/components/sections/ResultSet.jsx
View File

@@ -25,7 +25,7 @@ import { QuerySources } from './QueryHistory';
import { getBrowser } from '../../../../../../static/js/utils';
import CopyData from '../QueryToolDataGrid/CopyData';
import moment from 'moment';
import ConfirmSaveContent from '../dialogs/ConfirmSaveContent';
import ConfirmSaveContent from '../../../../../../static/js/Dialogs/ConfirmSaveContent';
import { makeStyles } from '@material-ui/styles';
import EmptyPanelMessage from '../../../../../../static/js/components/EmptyPanelMessage';
import { GraphVisualiser } from './GraphVisualiser';

7
web/pgadmin/tools/sqleditor/templates/sqleditor/index.html
View File

@@ -15,13 +15,6 @@
#sqleditor-container:not(:empty) + .pg-sp-container {
display: none;
}
{% if is_desktop_mode and is_linux %}
.alertify .ajs-dimmer,.alertify .ajs-modal{-webkit-transform: none;}
.alertify-notifier{-webkit-transform: none;}
.alertify-notifier .ajs-message{-webkit-transform: none;}
.alertify .ajs-dialog.ajs-shake{-webkit-animation-name: none;}
.sql-editor-busy-icon.fa-pulse{-webkit-animation: none;}
{% endif %}
</style>
<div id="sqleditor-container">
<div class="pg-sp-container">