IntenseWebs/pgadmin4
3
0
Fork 0
mirror of https://github.com/pgadmin-org/pgadmin4.git synced 2024-11-26 02:30:21 -06:00
Code Issues Packages Projects Releases Wiki Activity

Some more theme related fixes.

Browse Source
This commit is contained in:
Aditya Toshniwal 2022-07-04 14:26:33 +05:30 committed by Akshay Joshi
parent b283c0ba18
commit 239e3bb6f1
7 changed files with 93 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
web/pgadmin/browser/static/js/utility_view.jsx
View File

@ -14,6 +14,7 @@ import getApiInstance from 'sources/api_instance';
import {getHelpUrl, getEPASHelpUrl} from 'pgadmin.help'; import {getHelpUrl, getEPASHelpUrl} from 'pgadmin.help';
import SchemaView from 'sources/SchemaView'; import SchemaView from 'sources/SchemaView';
import 'wcdocker'; import 'wcdocker';
import Theme from '../../../static/js/Theme';
/* The entry point for rendering React based view in properties, called in node.js */ /* The entry point for rendering React based view in properties, called in node.js */
export function getUtilityView(schema, treeNodeInfo, actionType, formType, container, containerPanel, export function getUtilityView(schema, treeNodeInfo, actionType, formType, container, containerPanel,
@ -80,22 +81,24 @@ export function getUtilityView(schema, treeNodeInfo, actionType, formType, conta
/* Fire at will, mount the DOM */ /* Fire at will, mount the DOM */
ReactDOM.render( ReactDOM.render(
<SchemaView <Theme>
formType={formType} <SchemaView
schema={_schema} formType={formType}
viewHelperProps={viewHelperProps} schema={_schema}
customSaveBtnName={saveBtnName} viewHelperProps={viewHelperProps}
customSaveBtnIconType={saveBtnIcon} customSaveBtnName={saveBtnName}
onSave={onSaveClick} customSaveBtnIconType={saveBtnIcon}
onClose={()=>containerPanel.close()} onSave={onSaveClick}
onHelp={onHelp} onClose={()=>containerPanel.close()}
onDataChange={()=>{/*This is intentional (SonarQube)*/}} onHelp={onHelp}
confirmOnCloseReset={confirmOnReset} onDataChange={()=>{/*This is intentional (SonarQube)*/}}
hasSQL={false} confirmOnCloseReset={confirmOnReset}
isTabView={isTabView} hasSQL={false}
disableSqlHelp={sqlHelpUrl == undefined || sqlHelpUrl == ''} isTabView={isTabView}
disableDialogHelp={helpUrl == undefined || helpUrl == ''} disableSqlHelp={sqlHelpUrl == undefined || sqlHelpUrl == ''}
/>, container); disableDialogHelp={helpUrl == undefined || helpUrl == ''}
/>
</Theme>, container);
} }
/* When switching from normal node to collection node, clean up the React mounted DOM */ /* When switching from normal node to collection node, clean up the React mounted DOM */

19
web/pgadmin/tools/debugger/static/js/DebuggerModule.js
View File

@ -27,6 +27,7 @@ import { getFunctionId, getProcedureId, getAppropriateLabel, setDebuggerTitle }
import FunctionArguments from './debugger_ui'; import FunctionArguments from './debugger_ui';
import ModalProvider from '../../../../static/js/helpers/ModalProvider'; import ModalProvider from '../../../../static/js/helpers/ModalProvider';
import DebuggerComponent from './components/DebuggerComponent'; import DebuggerComponent from './components/DebuggerComponent';
import Theme from '../../../../static/js/Theme';
export default class Debugger { export default class Debugger {
static instance; static instance;
@ -684,13 +685,15 @@ export default class Debugger {
}); });
ReactDOM.render( ReactDOM.render(
<ModalProvider> <Theme>
<DebuggerComponent pgAdmin={pgWindow.pgAdmin} selectedNodeInfo={selectedNodeInfo} panel={panel} layout={layout} params={{ <ModalProvider>
transId: trans_id, <DebuggerComponent pgAdmin={pgWindow.pgAdmin} selectedNodeInfo={selectedNodeInfo} panel={panel} layout={layout} params={{
directDebugger: this, transId: trans_id,
funcArgsInstance: this.funcArgs directDebugger: this,
}} /> funcArgsInstance: this.funcArgs
</ModalProvider>, }} />
</ModalProvider>
</Theme>,
container container
); );
} }
@ -723,4 +726,4 @@ export default class Debugger {
function (evt) { evt.cancel = false; } function (evt) { evt.cancel = false; }
).set({ 'title': gettext('Rename Panel') }); ).set({ 'title': gettext('Rename Panel') });
} }
} }

29
web/pgadmin/tools/debugger/static/js/components/DebuggerComponent.jsx
View File

@ -17,7 +17,6 @@ import Loader from 'sources/components/Loader';
import Layout, { LayoutHelper } from '../../../../../static/js/helpers/Layout'; import Layout, { LayoutHelper } from '../../../../../static/js/helpers/Layout';
import EventBus from '../../../../../static/js/helpers/EventBus'; import EventBus from '../../../../../static/js/helpers/EventBus';
import Theme from '../../../../../static/js/Theme';
import getApiInstance from '../../../../../static/js/api_instance'; import getApiInstance from '../../../../../static/js/api_instance';
import Notify from '../../../../../static/js/helpers/Notifier'; import Notify from '../../../../../static/js/helpers/Notifier';
@ -153,7 +152,7 @@ export default function DebuggerComponent({ pgAdmin, selectedNodeInfo, panel, ev
if(panel) { if(panel) {
panel.close(); panel.close();
} }
}); });
} }
} catch (e) { } catch (e) {
@ -1232,20 +1231,18 @@ export default function DebuggerComponent({ pgAdmin, selectedNodeInfo, panel, ev
return ( return (
<DebuggerContext.Provider value={DebuggerContextValue}> <DebuggerContext.Provider value={DebuggerContextValue}>
<DebuggerEventsContext.Provider value={eventBus.current}> <DebuggerEventsContext.Provider value={eventBus.current}>
<Theme> <Loader message={loaderText} />
<Loader message={loaderText} /> <Box width="100%" height="100%" display="flex" flexDirection="column" flexGrow="1" tabIndex="0" ref={containerRef}>
<Box width="100%" height="100%" display="flex" flexDirection="column" flexGrow="1" tabIndex="0" ref={containerRef}> <ToolBar
<ToolBar containerRef={containerRef}
containerRef={containerRef} />
/> <Layout
<Layout getLayoutInstance={(obj) => docker.current = obj}
getLayoutInstance={(obj) => docker.current = obj} defaultLayout={defaultLayout}
defaultLayout={defaultLayout} layoutId="Debugger/Layout"
layoutId="Debugger/Layout" savedLayout={savedLayout}
savedLayout={savedLayout} />
/> </Box>
</Box>
</Theme>
</DebuggerEventsContext.Provider> </DebuggerEventsContext.Provider>
</DebuggerContext.Provider> </DebuggerContext.Provider>
); );

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

@ -27,6 +27,7 @@ import React from 'react';
import ReactDOM from 'react-dom'; import ReactDOM from 'react-dom';
import QueryToolComponent from './components/QueryToolComponent'; import QueryToolComponent from './components/QueryToolComponent';
import ModalProvider from '../../../../static/js/helpers/ModalProvider'; import ModalProvider from '../../../../static/js/helpers/ModalProvider';
import Theme from '../../../../static/js/Theme';
export function setPanelTitle(queryToolPanel, panelTitle) { export function setPanelTitle(queryToolPanel, panelTitle) {
@ -406,9 +407,11 @@ export default class SQLEditor {
}); });
this.setupPreferencesWorker(); this.setupPreferencesWorker();
ReactDOM.render( ReactDOM.render(
<ModalProvider> <Theme>
<QueryToolComponent params={params} pgWindow={pgWindow} pgAdmin={pgAdmin} panel={panel} selectedNodeInfo={selectedNodeInfo}/> <ModalProvider>
</ModalProvider>, <QueryToolComponent params={params} pgWindow={pgWindow} pgAdmin={pgAdmin} panel={panel} selectedNodeInfo={selectedNodeInfo}/>
</ModalProvider>
</Theme>,
container container
); );
} }

57
web/pgadmin/tools/sqleditor/static/js/components/QueryToolComponent.jsx
View File

@ -16,7 +16,6 @@ import { ResultSet } from './sections/ResultSet';
import { StatusBar } from './sections/StatusBar'; import { StatusBar } from './sections/StatusBar';
import { MainToolBar } from './sections/MainToolBar'; import { MainToolBar } from './sections/MainToolBar';
import { Messages } from './sections/Messages'; import { Messages } from './sections/Messages';
import Theme from 'sources/Theme';
import getApiInstance, {parseApiError} from '../../../../../static/js/api_instance'; import getApiInstance, {parseApiError} from '../../../../../static/js/api_instance';
import url_for from 'sources/url_for'; import url_for from 'sources/url_for';
import { PANELS, QUERY_TOOL_EVENTS, CONNECTION_STATUS } from './QueryToolConstants'; import { PANELS, QUERY_TOOL_EVENTS, CONNECTION_STATUS } from './QueryToolConstants';
@ -699,35 +698,33 @@ export default function QueryToolComponent({params, pgWindow, pgAdmin, selectedN
<QueryToolContext.Provider value={queryToolContextValue}> <QueryToolContext.Provider value={queryToolContextValue}>
<QueryToolConnectionContext.Provider value={queryToolConnContextValue}> <QueryToolConnectionContext.Provider value={queryToolConnContextValue}>
<QueryToolEventsContext.Provider value={eventBus.current}> <QueryToolEventsContext.Provider value={eventBus.current}>
<Theme> <Box width="100%" height="100%" display="flex" flexDirection="column" flexGrow="1" tabIndex="0" ref={containerRef}>
<Box width="100%" height="100%" display="flex" flexDirection="column" flexGrow="1" tabIndex="0" ref={containerRef}> <ConnectionBar
<ConnectionBar connected={qtState.connected}
connected={qtState.connected} connecting={qtState.obtaining_conn}
connecting={qtState.obtaining_conn} connectionStatus={qtState.connection_status}
connectionStatus={qtState.connection_status} connectionStatusMsg={qtState.connection_status_msg}
connectionStatusMsg={qtState.connection_status_msg} connectionList={qtState.connection_list}
connectionList={qtState.connection_list} onConnectionChange={(connectionData)=>updateQueryToolConnection(connectionData)}
onConnectionChange={(connectionData)=>updateQueryToolConnection(connectionData)} onNewConnClick={onNewConnClick}
onNewConnClick={onNewConnClick} onNewQueryToolClick={onNewQueryToolClick}
onNewQueryToolClick={onNewQueryToolClick} onResetLayout={onResetLayout}
onResetLayout={onResetLayout} docker={docker.current}
docker={docker.current} />
/> {React.useMemo(()=>(
{React.useMemo(()=>( <MainToolBar
<MainToolBar containerRef={containerRef}
containerRef={containerRef} onManageMacros={onManageMacros}
onManageMacros={onManageMacros} onFilterClick={onFilterClick}
onFilterClick={onFilterClick} />), [containerRef.current, onManageMacros, onFilterClick])}
/>), [containerRef.current, onManageMacros, onFilterClick])} <Layout
<Layout getLayoutInstance={(obj)=>docker.current=obj}
getLayoutInstance={(obj)=>docker.current=obj} defaultLayout={defaultLayout}
defaultLayout={defaultLayout} layoutId="SQLEditor/Layout"
layoutId="SQLEditor/Layout" savedLayout={params.layout}
savedLayout={params.layout} />
/> <StatusBar />
<StatusBar /> </Box>
</Box>
</Theme>
</QueryToolEventsContext.Provider> </QueryToolEventsContext.Provider>
</QueryToolConnectionContext.Provider> </QueryToolConnectionContext.Provider>
</QueryToolContext.Provider> </QueryToolContext.Provider>

12
web/regression/javascript/debugger/MockDebuggerComponent.jsx
View File

@ -15,13 +15,13 @@ import {DebuggerContext, DebuggerEventsContext} from '../../../pgadmin/tools/deb
export default function MockDebuggerComponent({value, eventsvalue, children}) { export default function MockDebuggerComponent({value, eventsvalue, children}) {
return ( return (
<DebuggerContext.Provider value={value}> <Theme>
<DebuggerEventsContext.Provider value={eventsvalue}> <DebuggerContext.Provider value={value}>
<Theme> <DebuggerEventsContext.Provider value={eventsvalue}>
{children} {children}
</Theme> </DebuggerEventsContext.Provider>
</DebuggerEventsContext.Provider> </DebuggerContext.Provider>
</DebuggerContext.Provider> </Theme>
); );
} }

19
web/regression/javascript/debugger/debugger_spec.js
View File

@ -27,6 +27,7 @@ import DebuggerComponent from '../../../pgadmin/tools/debugger/static/js/compone
import FunctionArguments from '../../../pgadmin/tools/debugger/static/js/debugger_ui'; import FunctionArguments from '../../../pgadmin/tools/debugger/static/js/debugger_ui';
import Debugger from '../../../pgadmin/tools/debugger/static/js/DebuggerModule'; import Debugger from '../../../pgadmin/tools/debugger/static/js/DebuggerModule';
import {TreeFake} from '../tree/tree_fake'; import {TreeFake} from '../tree/tree_fake';
import Theme from '../../../pgadmin/static/js/Theme';
describe('Debugger Component', () => { describe('Debugger Component', () => {
@ -266,14 +267,16 @@ describe('Debugger Component', () => {
networkMock.onGet(url_for('debugger.execute_query', {'trans_id': params.transId, 'query_type': 'get_stack_info'})).reply(200, {'success':1,'errormsg':'','info':'','result':null,'data':{'status':'Success','result':[{'level':0,'targetname':'_test()','func':3138947,'linenumber':9,'args':''}]}}); networkMock.onGet(url_for('debugger.execute_query', {'trans_id': params.transId, 'query_type': 'get_stack_info'})).reply(200, {'success':1,'errormsg':'','info':'','result':null,'data':{'status':'Success','result':[{'level':0,'targetname':'_test()','func':3138947,'linenumber':9,'args':''}]}});
networkMock.onGet(url_for('debugger.poll_result', {'trans_id': params.transId})).reply(200, {'success':0,'errormsg':'','info':'','result':null,'data':{'status':'Success','result':[{'pldbg_wait_for_target':28298}]}}); networkMock.onGet(url_for('debugger.poll_result', {'trans_id': params.transId})).reply(200, {'success':0,'errormsg':'','info':'','result':null,'data':{'status':'Success','result':[{'pldbg_wait_for_target':28298}]}});
let ctrl = mount( let ctrl = mount(
<DebuggerComponent <Theme>
pgAdmin={pgAdmin} <DebuggerComponent
panel={document.getElementById('debugger-main-container')} pgAdmin={pgAdmin}
selectedNodeInfo={nodeInfo} panel={document.getElementById('debugger-main-container')}
layout={''} selectedNodeInfo={nodeInfo}
params={params} layout={''}
> params={params}
</DebuggerComponent> >
</DebuggerComponent>
</Theme>
); );
ctrl.find('PgIconButton[data-test="debugger-contiue"]').props().onClick(); ctrl.find('PgIconButton[data-test="debugger-contiue"]').props().onClick();