Skip to content

Commit f098b47

Browse files
DileepadariDileepadari
committed
some more refactoring
1 parent 70b642a commit f098b47

24 files changed

+678
-505
lines changed

‎administrator/components/com_workflow/resources/scripts/app/Event.es6.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export default new class EventBus {
1717
* @param {*} [data=null] - Optional payload
1818
*/
1919
fire(event, data = null) {
20-
(this.events[event] || []).forEach(fn => fn(data));
20+
(this.events[event] || []).forEach((fn) => fn(data));
2121
}
2222

2323
/**
@@ -39,7 +39,7 @@ export default new class EventBus {
3939
*/
4040
off(event, callback) {
4141
if (this.events[event]) {
42-
this.events[event] = this.events[event].filter(fn => fn !== callback);
42+
this.events[event] = this.events[event].filter((fn) => fn !== callback);
4343
}
4444
}
4545
}();

‎administrator/components/com_workflow/resources/scripts/app/WorkflowGraphApi.es6.js‎

Lines changed: 37 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
/**
22
* Handles API communication for the workflow graph.
33
*/
4+
45
class WorkflowGraphApi {
56

67
/**
@@ -11,7 +12,7 @@ class WorkflowGraphApi {
1112
constructor() {
1213
const {
1314
apiBaseUrl,
14-
extension
15+
extension,
1516
} = Joomla.getOptions('com_workflow', {});
1617

1718
if (!apiBaseUrl) {
@@ -47,33 +48,30 @@ class WorkflowGraphApi {
4748
Joomla.request({
4849
url: `${this.baseUrl}${url}&extension=${this.extension}`,
4950
...options,
50-
onSuccess: (responseText, xhr) => {
51+
onSuccess: (responseText) => {
5152
const response = responseText?.trim();
5253
try {
5354
const parsed = JSON.parse(response);
5455
resolve(parsed);
55-
return;
5656
} catch {
57-
58-
}
59-
const temp = document.createElement('div');
60-
temp.innerHTML = response;
61-
62-
const success = temp.querySelector('joomla-alert[type="success"] .alert-message');
63-
if (success) {
64-
resolve({ success: true, message: success.textContent.trim() });
65-
return;
66-
}
67-
68-
const error = temp.querySelector('joomla-alert[type="error"], joomla-alert[type="danger"], joomla-alert[type="warning"] .alert-message');
69-
if (error) {
70-
const msg = error.querySelector('.alert-message')?.textContent.trim() || 'An error occurred.';
71-
reject(new Error(msg));
72-
return;
57+
const temp = document.createElement('div');
58+
temp.innerHTML = response;
59+
60+
const success = temp.querySelector('joomla-alert[type="success"] .alert-message');
61+
if (success) {
62+
resolve({success: true, message: success.textContent.trim()});
63+
return;
64+
}
65+
66+
const error = temp.querySelector('joomla-alert[type="error"], joomla-alert[type="danger"], joomla-alert[type="warning"] .alert-message');
67+
if (error) {
68+
const msg = error.querySelector('.alert-message')?.textContent.trim() || 'An error occurred.';
69+
reject(new Error(msg));
70+
return;
71+
}
72+
73+
resolve({success: true, message: 'No system message. Assuming success.', raw: response});
7374
}
74-
75-
// No message, assume okay
76-
resolve({ success: true, message: 'No system message. Assuming success.', raw: response });
7775
},
7876
onError: (xhr) => {
7977
let message = 'Network error';
@@ -84,7 +82,7 @@ class WorkflowGraphApi {
8482
message = xhr.statusText || message;
8583
}
8684
reject(new Error(message));
87-
}
85+
},
8886
});
8987
});
9088
}
@@ -101,13 +99,13 @@ class WorkflowGraphApi {
10199
const data = typeof response === 'string' ? JSON.parse(response) : response;
102100

103101
if (data.success === false) {
104-
WorkflowGraph.Event.fire('onWorkflowError', { error: data.message || 'Failed to load workflow' });
102+
window.WorkflowGraph.Event.fire('onWorkflowError', { error: data.message || 'Failed to load workflow' });
105103
return null;
106104
}
107105

108106
return data?.data || data;
109107
} catch (error) {
110-
WorkflowGraph.Event.fire('onWorkflowError', { error: error.message });
108+
window.WorkflowGraph.Event.fire('onWorkflowError', { error: error.message });
111109
throw error;
112110
}
113111
}
@@ -124,13 +122,13 @@ class WorkflowGraphApi {
124122
const data = typeof response === 'string' ? JSON.parse(response) : response;
125123

126124
if (data.success === false) {
127-
WorkflowGraph.Event.fire('onStagesError', { error: data.message || 'Failed to load stages' });
125+
window.WorkflowGraph.Event.fire('onStagesError', { error: data.message || 'Failed to load stages' });
128126
return null;
129127
}
130128

131129
return data?.data || data;
132130
} catch (error) {
133-
WorkflowGraph.Event.fire('onStagesError', { error: error.message });
131+
window.WorkflowGraph.Event.fire('onStagesError', { error: error.message });
134132
throw error;
135133
}
136134
}
@@ -147,13 +145,13 @@ class WorkflowGraphApi {
147145
const data = typeof response === 'string' ? JSON.parse(response) : response;
148146

149147
if (data.success === false) {
150-
WorkflowGraph.Event.fire('onTransitionsError', { error: data.message || 'Failed to load transitions' });
148+
window.WorkflowGraph.Event.fire('onTransitionsError', { error: data.message || 'Failed to load transitions' });
151149
return null;
152150
}
153151

154152
return data?.data || data;
155153
} catch (error) {
156-
WorkflowGraph.Event.fire('onTransitionsError', { error: error.message });
154+
window.WorkflowGraph.Event.fire('onTransitionsError', { error: error.message });
157155
throw error;
158156
}
159157
}
@@ -173,7 +171,7 @@ class WorkflowGraphApi {
173171
formData.append('cid[]', id);
174172
formData.append('workflow_id', workflowId);
175173
formData.append(this.csrfToken, '1');
176-
if(stageDelete){
174+
if (stageDelete) {
177175
formData.append('task', 'stages.delete');
178176
} else {
179177
formData.append('task', 'stages.trash');
@@ -186,13 +184,13 @@ class WorkflowGraphApi {
186184

187185
const data = typeof response === 'string' ? JSON.parse(response) : response;
188186
if (data.success === false) {
189-
WorkflowGraph.Event.fire('onStageError', { error: data.message || 'Failed to delete stage' });
187+
window.WorkflowGraph.Event.fire('onStageError', { error: data.message || 'Failed to delete stage' });
190188
return false;
191189
}
192190

193191
return true;
194192
} catch (error) {
195-
WorkflowGraph.Event.fire('onStageError', { error: error.message });
193+
window.WorkflowGraph.Event.fire('onStageError', { error: error.message });
196194
throw error;
197195
}
198196
}
@@ -220,12 +218,12 @@ class WorkflowGraphApi {
220218
const data = typeof response === 'string' ? JSON.parse(response) : response;
221219

222220
if (data.success === false) {
223-
WorkflowGraph.Event.fire('onTransitionError', { error: data.message || 'Failed to delete transition' })
221+
window.WorkflowGraph.Event.fire('onTransitionError', { error: data.message || 'Failed to delete transition' });
224222
}
225223

226224
return true;
227225
} catch (error) {
228-
WorkflowGraph.Event.fire('onTransitionError', { error: error.message });
226+
window.WorkflowGraph.Event.fire('onTransitionError', { error: error.message });
229227
throw error;
230228
}
231229
}
@@ -238,7 +236,7 @@ class WorkflowGraphApi {
238236
* @returns {Promise<Object|null>}
239237
*/
240238
async updateStagePosition(workflowId, positions) {
241-
try{
239+
try {
242240
const formData = new FormData();
243241
formData.append('workflow_id', workflowId);
244242
formData.append(this.csrfToken, '1');
@@ -248,21 +246,21 @@ class WorkflowGraphApi {
248246
formData.append(`positions[${id}][y]`, position.y);
249247
});
250248

251-
const response = await this.makeRequest(`&task=stages.updateStagesPosition&format=raw`, {
249+
const response = await this.makeRequest('&task=stages.updateStagesPosition&format=raw', {
252250
method: 'POST',
253-
data: formData
251+
data: formData,
254252
});
255253

256254
const data = typeof response === 'string' ? JSON.parse(response) : response;
257255

258256
if (data.success === false) {
259-
WorkflowGraph.Event.fire('onUpdatePositionError', { error: data.message || 'Failed to update stage positions' });
257+
window.WorkflowGraph.Event.fire('onUpdatePositionError', { error: data.message || 'Failed to update stage positions' });
260258
return null;
261259
}
262260

263261
return data.data || data;
264262
} catch (error) {
265-
WorkflowGraph.Event.fire('onStageError', { error: error.message });
263+
window.WorkflowGraph.Event.fire('onStageError', { error: error.message });
266264
throw error;
267265
}
268266
}

‎administrator/components/com_workflow/resources/scripts/components/App.vue‎

Lines changed: 29 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,33 @@
11
<template>
2-
<div
3-
id="workflow-app"
4-
class="workflow-app-container d-flex flex-column flex-grow-1 min-vh-80"
5-
role="application"
6-
aria-label="appTitle">
7-
<div class="d-flex flex-column flex-shrink-0" role="banner">
8-
<WorkflowTitlebar
2+
<div
3+
id="workflow-app"
4+
class="workflow-app-container d-flex flex-column flex-grow-1 min-vh-80"
5+
role="application"
6+
aria-label="appTitle"
7+
>
8+
<div class="d-flex flex-column flex-shrink-0"
9+
role="banner"
10+
>
11+
<WorkflowTitlebar
12+
:save-status="saveStatus"
13+
/>
14+
</div>
15+
<div class="d-flex flex-grow-1 overflow-hidden">
16+
<div
17+
id="main-canvas"
18+
class="flex-grow-1 position-relative"
19+
role="main"
20+
aria-labelledby="workflow-heading"
21+
>
22+
<WorkflowCanvas
23+
ref="canvas"
924
:save-status="saveStatus"
25+
:set-save-status="setSaveStatus"
26+
@focus-request="handleCanvasFocus"
1027
/>
1128
</div>
12-
<div class="d-flex flex-grow-1 overflow-hidden">
13-
<div
14-
class="flex-grow-1 position-relative"
15-
role="main"
16-
aria-labelledby="workflow-heading"
17-
id="main-canvas"
18-
>
19-
<WorkflowCanvas
20-
ref="canvas"
21-
:save-status="saveStatus"
22-
:set-save-status="setSaveStatus"
23-
@focus-request="handleCanvasFocus" />
24-
</div>
25-
</div>
2629
</div>
30+
</div>
2731
</template>
2832

2933
<script setup>
@@ -33,11 +37,10 @@ import WorkflowTitlebar from './Titlebar.vue';
3337
import WorkflowCanvas from './canvas/WorkflowCanvas.vue';
3438
3539
const store = useStore();
36-
const saveStatus = ref('upToDate')
40+
const saveStatus = ref('upToDate');
3741
function setSaveStatus(val) {
38-
saveStatus.value = val
42+
saveStatus.value = val;
3943
}
40-
const ariaLive = ref(null);
4144
const canvas = ref(null);
4245
4346
function handleCanvasFocus() {
@@ -49,7 +52,7 @@ onMounted(() => {
4952
const idFromURL = parseInt(new URL(window.location.href).searchParams.get('id'), 10);
5053
const workflowIdFinal = idFromOpts || idFromURL;
5154
52-
if (workflowIdFinal !== null && !isNaN(workflowIdFinal)) {
55+
if (workflowIdFinal !== null && !Number.isNaN(workflowIdFinal)) {
5356
store.dispatch('loadWorkflow', workflowIdFinal);
5457
} else {
5558
throw new Error('COM_WORKFLOW_GRAPH_INVALID_WORKFLOW_ID');
@@ -59,6 +62,6 @@ onMounted(() => {
5962
6063
<script>
6164
export default {
62-
name: 'WorkflowGraphApp'
65+
name: 'WorkflowGraphApp',
6366
};
6467
</script>

‎administrator/components/com_workflow/resources/scripts/components/Titlebar.vue‎

Lines changed: 27 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,21 @@
11
<template>
2-
<section class="workflow-graph-titlebar d-flex flex-wrap align-items-center justify-content-between" aria-labelledby="workflow-title" role="region">
2+
<section class="workflow-graph-titlebar d-flex flex-wrap align-items-center justify-content-between"
3+
aria-labelledby="workflow-title"
4+
role="region"
5+
>
36
<div class="col-md-6 d-flex flex-column">
4-
<h1 class="h2 mb-2" id="workflow-title">{{ translate(workflow?.title) }}</h1>
5-
<dl class="d-flex align-items-center flex-wrap mb-0" aria-label="workflow details">
7+
<h1 id="workflow-title"
8+
class="h2 mb-2"
9+
>
10+
{{ translate(workflow?.title) }}
11+
</h1>
12+
<dl class="d-flex align-items-center flex-wrap mb-0"
13+
aria-label="workflow details"
14+
>
615
<div class="me-3 mb-1 d-flex align-items-center">
7-
<dt class="visually-hidden">{{ translate('COM_WORKFLOW_GRAPH_STATUS') }}</dt>
16+
<dt class="visually-hidden">
17+
{{ translate('COM_WORKFLOW_GRAPH_STATUS') }}
18+
</dt>
819
<dd>
920
<span
1021
class="badge"
@@ -16,24 +27,29 @@
1627
</dd>
1728
</div>
1829
<div class="me-3 mb-1 d-flex align-items-center">
19-
<dt class="visually-hidden">{{ translate('COM_WORKFLOW_GRAPH_STAGE_COUNT') }}</dt>
30+
<dt class="visually-hidden">
31+
{{ translate('COM_WORKFLOW_GRAPH_STAGE_COUNT') }}
32+
</dt>
2033
<dd>
2134
{{ stagesCount }} {{ stagesCount === 1 ? translate('COM_WORKFLOW_GRAPH_STAGE') : translate('COM_WORKFLOW_GRAPH_STAGES') }}
2235
</dd>
2336
</div>
2437
<div class="me-3 mb-1 d-flex align-items-center">
25-
<dt class="visually-hidden">{{ translate('COM_WORKFLOW_GRAPH_TRANSITION_COUNT') }}</dt>
38+
<dt class="visually-hidden">
39+
{{ translate('COM_WORKFLOW_GRAPH_TRANSITION_COUNT') }}
40+
</dt>
2641
<dd>
27-
{{ transitionsCount }} {{ transitionsCount === 1 ? translate('COM_WORKFLOW_GRAPH_TRANSITION') : translate('COM_WORKFLOW_GRAPH_TRANSITIONS') }}
42+
{{ transitionsCount }} {{ transitionsCount === 1 ? translate('COM_WORKFLOW_GRAPH_TRANSITION') :
43+
translate('COM_WORKFLOW_GRAPH_TRANSITIONS') }}
2844
</dd>
2945
</div>
3046
</dl>
3147
</div>
3248
<div
3349
id="save-message"
3450
:class="{
35-
'text-warning': saveStatus.value === 'unsaved',
36-
'text-muted': saveStatus.value !== 'unsaved'
51+
'text-warning': saveStatus.value === 'unsaved',
52+
'text-muted': saveStatus.value !== 'unsaved'
3753
}"
3854
class="mb-2 text-success fw-bold"
3955
>
@@ -52,8 +68,8 @@ export default {
5268
props: {
5369
saveStatus: {
5470
type: String,
55-
default: 'upToDate'
56-
}
71+
default: 'upToDate',
72+
},
5773
},
5874
computed: {
5975
workflow() {

0 commit comments

Comments
 (0)