Continue fixing multiple UI issues found when testing wcDocker changes. #6479

This commit is contained in:
Aditya Toshniwal 2023-11-06 18:08:16 +05:30
parent 0d8adf9ced
commit ef0b30b1ca
11 changed files with 40 additions and 21 deletions

View File

@ -39,5 +39,9 @@ Bug fixes
| `Issue #6487 <https://github.com/pgadmin-org/pgadmin4/issues/6487>`_ - Fixed restoration of query tool database connection after dropping and re-creating the database with the same name.
| `Issue #6602 <https://github.com/pgadmin-org/pgadmin4/issues/6602>`_ - Fix an issue where the default server-group is being deleted if the load-server json file contains no servers.
| `Issue #6720 <https://github.com/pgadmin-org/pgadmin4/issues/6720>`_ - Fix an issue of the incorrect format (no indent) of SQL stored functions/procedures.
| `Issue #6769 <https://github.com/pgadmin-org/pgadmin4/issues/6769>`_ - Server config information in the about dialog should be only visible to admin users.
| `Issue #6784 <https://github.com/pgadmin-org/pgadmin4/issues/6784>`_ - Fixed an issue where Schema Diff does not work when the user language is set to any language other than English in Preferences.
| `Issue #6817 <https://github.com/pgadmin-org/pgadmin4/issues/6817>`_ - Fixed the query generated when creating subscription where copy_data parameter was missing.
| `Issue #6820 <https://github.com/pgadmin-org/pgadmin4/issues/6820>`_ - Ensure backup/restore/maintenance works with invalid pgpass file parameter.
| `Issue #6874 <https://github.com/pgadmin-org/pgadmin4/issues/6874>`_ - Fix an issue where the browser window stuck on spinning with an Oauth user without email.
| `Issue #6877 <https://github.com/pgadmin-org/pgadmin4/issues/6877>`_ - Remove the max length of 255 from password exec command in server configuration dialog.

View File

@ -422,7 +422,7 @@ export function StorageWrapper(props) {
return label;
},
label: function (context) {
return (context.dataset?.label ?? 'Total space: ') + toPrettySize(context.raw);
return `${context.dataset?.label ?? gettext('Total space')}: ${toPrettySize(context.raw)}`;
},
},
},

View File

@ -67,6 +67,7 @@ const useStyles = makeStyles((theme) =>
display: 'flex',
flexDirection: 'column',
height: '100%',
minHeight: 0,
},
preferences: {
borderColor: theme.otherVars.borderColor,

View File

@ -83,7 +83,7 @@ function HelpArticleContents({isHelpLoading, isMenuLoading, helpSearchResult}) {
<div>
<div className={classes.helpGroup}>
<span className='fa fa-question-circle'></span>
&nbsp;HELP ARTICLES
&nbsp;HELP ARTICLES&nbsp;
{Object.keys(helpSearchResult.data).length > 10
? '(10 of ' + Object.keys(helpSearchResult.data).length + ')'
: '(' + Object.keys(helpSearchResult.data).length + ')'
@ -301,8 +301,7 @@ export default function QuickSearch({closeModal}) {
<div>
<div className={classes.helpGroup}>
<span className='fa fa-question-circle'></span> &nbsp;{gettext('HELP ARTICLES')} {Object.keys(helpSearchResult.data).length > 10 ?
<span>(10 of {Object.keys(helpSearchResult.data).length} )
</span>:
<span> (10 of {Object.keys(helpSearchResult.data).length})</span>:
'(' + Object.keys(helpSearchResult.data).length + ')'}&nbsp;
{ !helpSearchResult.clearedPooling ? <CircularProgress style={{height: '18px', width: '18px'}} /> :''}
{ Object.keys(helpSearchResult.data).length > 10 ? <a href={helpSearchResult.url} className={classes.showAll} target='_blank' rel='noreferrer'>{gettext('Show all')} &nbsp;<span className='fas fa-external-link-alt' ></span></a> : ''}

View File

@ -50,6 +50,10 @@ const useStyles = makeStyles((theme)=>({
},
sqlTabInput: {
border: 0,
},
nonTabPanel: {
padding: 0,
background: 'inherit',
}
}));
@ -453,12 +457,15 @@ export default function FormView({
let contentClassName = [stateUtils.formErr.message ? classes.errorMargin : null];
return (
<>
<Box height="100%" display="flex" flexDirection="column" className={clsx(className, contentClassName)} ref={formRef} data-test="form-view">
{Object.keys(finalTabs).map((tabName)=>{
return (
<React.Fragment key={tabName}>{finalTabs[tabName]}</React.Fragment>
);
})}
<Box height="100%" display="flex" flexDirection="column" className={clsx(className)} ref={formRef} data-test="form-view">
<TabPanel value={tabValue} index={0} classNameRoot={classes.nonTabPanel}
className={clsx(contentClassName)}>
{Object.keys(finalTabs).map((tabName)=>{
return (
<React.Fragment key={tabName}>{finalTabs[tabName]}</React.Fragment>
);
})}
</TabPanel>
</Box>
</>);
}

View File

@ -25,7 +25,7 @@ import { parseApiError } from '../api_instance';
const AUTO_HIDE_DURATION = 3000; // In milliseconds
const FinalNotifyContent = React.forwardRef(({children}, ref) => {
export const FinalNotifyContent = React.forwardRef(({children}, ref) => {
return <SnackbarContent style= {{justifyContent:'end', maxWidth: '700px'}} ref={ref}>{children}</SnackbarContent>;
});
FinalNotifyContent.displayName = 'FinalNotifyContent';

View File

@ -25,7 +25,7 @@ export default function withStandardTabInfo(Component, tabId) {
useEffect(()=>{
const i = pgAdmin.Browser.tree?.selected();
if(i) {
setNodeInfo([i, pgAdmin.Browser.tree.itemData(i)]);
setNodeInfo([true, i, pgAdmin.Browser.tree.itemData(i)]);
}
setIsActive(layoutDocker.isTabVisible(tabId));
@ -41,7 +41,7 @@ export default function withStandardTabInfo(Component, tabId) {
setNodeInfo([true, item, data]);
});
let deregisterTreeUpdate = pgAdmin.Browser.Events.on('pgadmin-browser:tree:updated', (item, data)=>{
setNodeInfo([item, data]);
setNodeInfo([true, item, data]);
});
let deregisterActive = layoutDocker.eventBus.registerListener(LAYOUT_EVENTS.ACTIVE, onTabActive);
// if there is any dock changes to the tab and it appears to be active/inactive

View File

@ -46,6 +46,7 @@ const useStyles = makeStyles((theme) =>
display: 'flex',
flexDirection: 'column',
height: '100%',
minHeight: 0,
},
actionBtn: {
alignItems: 'flex-start',

View File

@ -22,6 +22,7 @@ import { BROWSER_PANELS } from '../../../../browser/static/js/constants';
import { NotifierProvider } from '../../../../static/js/helpers/Notifier';
import usePreferences from '../../../../preferences/static/js/store';
import pgAdmin from 'sources/pgadmin';
import { PgAdminContext } from '../../../../static/js/BrowserComponent';
export default class SchemaDiff {
@ -102,10 +103,12 @@ export default class SchemaDiff {
load(container, trans_id) {
ReactDOM.render(
<Theme>
<ModalProvider>
<NotifierProvider pgAdmin={pgAdmin} pgWindow={pgWindow} />
<SchemaDiffComponent params={{ transId: trans_id, pgAdmin: pgWindow.pgAdmin }}></SchemaDiffComponent>
</ModalProvider>
<PgAdminContext.Provider value={pgAdmin}>
<ModalProvider>
<NotifierProvider pgAdmin={pgAdmin} pgWindow={pgWindow} />
<SchemaDiffComponent params={{ transId: trans_id, pgAdmin: pgWindow.pgAdmin }}></SchemaDiffComponent>
</ModalProvider>
</PgAdminContext.Provider>
</Theme>,
container
);

View File

@ -310,13 +310,17 @@ export function SchemaDiffCompare({ params }) {
try {
setCompareOptions(compareParams);
socket = await openSocket('/schema_diff');
socket.on('compare_status', res=>{
const compareStatus = _.debounce(res=>{
let msg = res.compare_msg;
msg = msg + gettext(` (this may take a few minutes)... ${Math.round(res.diff_percentage)} %`);
setLoaderText(msg);
});
}, 250);
socket.on('compare_status', compareStatus);
resData = await socketApiGet(socket, socketEndpoint, url_params);
setShowResultGrid(true);
// stop the listeners
socket.off('compare_status', compareStatus);
compareStatus.cancel();
setLoaderText(null);
setFilterOptions(filterParams);
getResultGridData(resData, filterParams);

View File

@ -704,7 +704,7 @@ export default function QueryToolComponent({params, pgWindow, pgAdmin, selectedN
};
const onManageMacros = useCallback(()=>{
const onClose = ()=>LayoutDocker.close(docker.current, 'manage-macros');
const onClose = ()=>docker.current.close('manage-macros');
docker.current.openDialog({
id: 'manage-macros',
title: gettext('Manage Macros'),
@ -723,7 +723,7 @@ export default function QueryToolComponent({params, pgWindow, pgAdmin, selectedN
}, [qtState.preferences.browser]);
const onFilterClick = useCallback(()=>{
const onClose = ()=>LayoutDocker.close(docker.current, 'filter-dialog');
const onClose = ()=>docker.current.close('filter-dialog');
docker.current.openDialog({
id: 'filter-dialog',
title: gettext('Sort/Filter options'),