From 97d9402c24b4230def9d6e3b2862cbe01013e7bc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Jarda=20Kot=C4=9B=C5=A1ovec?= <jarda.kotesovec@gmail.com>
Date: Wed, 16 Oct 2024 11:14:33 +0200
Subject: [PATCH] pkp/pkp-lib#7495 workflow store refactor to have separate
 version for OMP and OJS

---
 src/components/Container/Page.vue             |   2 +
 .../ChapterManager/ChapterManager.vue         |  21 +
 .../PublicationFormatManager.vue              |  21 +
 .../RepresentativeManager.vue                 |  19 +
 src/pages/dashboard/dashboardPageStore.js     |   3 +-
 .../{Workflow.vue => WorkflowPage.vue}        |  80 +-
 src/pages/workflow/WorkflowPageOMP.vue        |  15 +
 .../components/header/WorkflowWorkTypeOMP.vue |  52 ++
 .../publication/WorkflowMarketingForm.vue     |  42 ++
 .../publication/WorkflowPublicationForm.vue   |   4 +-
 .../composables/useWorkflowActions.js         |  18 +
 .../useWorkflowConfig/useWorkflowConfigOJS.js | 156 ++++
 .../useWorkflowConfig/useWorkflowConfigOMP.js | 157 ++++
 .../workflowConfigAuthorOJS.js                | 361 +++++++++
 .../workflowConfigAuthorOMP.js}               | 129 +---
 .../workflowConfigEditorialOJS.js}            | 123 +--
 .../workflowConfigEditorialOMP.js             | 707 ++++++++++++++++++
 .../useWorkflowDataSubmissionPublication.js   |  56 ++
 .../composables/useWorkflowDecisions.js       | 143 +++-
 .../workflow/composables/useWorkflowItems.js  |  36 +
 .../workflow/composables/useWorkflowMenu.js   |  56 ++
 .../useWorkflowNavigationConfig.js            | 340 ---------
 .../useWorkflowNavigation.js                  |   4 +
 .../useWorkflowNavigationConfigOJS.js         | 312 ++++++++
 .../useWorkflowNavigationConfigOMP.js         | 338 +++++++++
 .../composables/useWorkflowPermissions.js     | 126 ++++
 src/pages/workflow/workflowStore.js           | 415 +---------
 src/pages/workflow/workflowStoreOMP.js        | 275 +++++++
 src/utils/defineComponentStore.js             |   8 +-
 src/utils/wrapActionFns.js                    |   8 +
 30 files changed, 2984 insertions(+), 1043 deletions(-)
 create mode 100644 src/managers/ChapterManager/ChapterManager.vue
 create mode 100644 src/managers/PublicationFormatManager/PublicationFormatManager.vue
 create mode 100644 src/managers/RepresentativeManager/RepresentativeManager.vue
 rename src/pages/workflow/{Workflow.vue => WorkflowPage.vue} (51%)
 create mode 100644 src/pages/workflow/WorkflowPageOMP.vue
 create mode 100644 src/pages/workflow/components/header/WorkflowWorkTypeOMP.vue
 create mode 100644 src/pages/workflow/components/publication/WorkflowMarketingForm.vue
 create mode 100644 src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOJS.js
 create mode 100644 src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOMP.js
 create mode 100644 src/pages/workflow/composables/useWorkflowConfig/workflowConfigAuthorOJS.js
 rename src/pages/workflow/composables/{useWorkflowAuthorConfig.js => useWorkflowConfig/workflowConfigAuthorOMP.js} (75%)
 rename src/pages/workflow/composables/{useWorkflowEditorialConfig.js => useWorkflowConfig/workflowConfigEditorialOJS.js} (86%)
 create mode 100644 src/pages/workflow/composables/useWorkflowConfig/workflowConfigEditorialOMP.js
 create mode 100644 src/pages/workflow/composables/useWorkflowDataSubmissionPublication.js
 create mode 100644 src/pages/workflow/composables/useWorkflowItems.js
 create mode 100644 src/pages/workflow/composables/useWorkflowMenu.js
 delete mode 100644 src/pages/workflow/composables/useWorkflowNavigationConfig.js
 create mode 100644 src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigation.js
 create mode 100644 src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOJS.js
 create mode 100644 src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOMP.js
 create mode 100644 src/pages/workflow/composables/useWorkflowPermissions.js
 create mode 100644 src/pages/workflow/workflowStoreOMP.js
 create mode 100644 src/utils/wrapActionFns.js

diff --git a/src/components/Container/Page.vue b/src/components/Container/Page.vue
index eb857f93d..ff17f0a50 100644
--- a/src/components/Container/Page.vue
+++ b/src/components/Container/Page.vue
@@ -1,6 +1,7 @@
 <script type="text/javascript">
 import Container from '@/components/Container/Container.vue';
 import ModalManager from '@/components/Modal/ModalManager.vue';
+import DashboardPage from '@/pages/dashboard/DashboardPage.vue';
 
 import PkpAnnouncer from '@/components/Announcer/Announcer.vue';
 import ReviewerSubmissionPage from '@/pages/reviewerSubmission/ReviewerSubmissionPage.vue';
@@ -19,6 +20,7 @@ export default {
 		FailedJobsPage,
 		FailedJobDetailsPage,
 		CounterReportsPage,
+		DashboardPage,
 	},
 	extends: Container,
 	data() {
diff --git a/src/managers/ChapterManager/ChapterManager.vue b/src/managers/ChapterManager/ChapterManager.vue
new file mode 100644
index 000000000..b435c3de9
--- /dev/null
+++ b/src/managers/ChapterManager/ChapterManager.vue
@@ -0,0 +1,21 @@
+<template>
+	<GridWrapper
+		:key="`${submissionId} - ${publicationId}`"
+		grid-component="grid.users.chapter.ChapterGridHandler"
+		:params="params"
+	></GridWrapper>
+</template>
+<script setup>
+import GridWrapper from '@/components/GridWrapper/GridWrapper.vue';
+import {computed} from 'vue';
+
+const props = defineProps({
+	submissionId: {type: String, required: true},
+	publicationId: {type: String, required: true},
+});
+
+const params = computed(() => ({
+	submissionId: props.submissionId,
+	publicationId: props.publicationId,
+}));
+</script>
diff --git a/src/managers/PublicationFormatManager/PublicationFormatManager.vue b/src/managers/PublicationFormatManager/PublicationFormatManager.vue
new file mode 100644
index 000000000..a75621b10
--- /dev/null
+++ b/src/managers/PublicationFormatManager/PublicationFormatManager.vue
@@ -0,0 +1,21 @@
+<template>
+	<GridWrapper
+		:key="`${submissionId} - ${publicationId}`"
+		grid-component="grid.catalogEntry.PublicationFormatGridHandler"
+		:params="params"
+	></GridWrapper>
+</template>
+<script setup>
+import GridWrapper from '@/components/GridWrapper/GridWrapper.vue';
+import {computed} from 'vue';
+
+const props = defineProps({
+	submissionId: {type: String, required: true},
+	publicationId: {type: String, required: true},
+});
+
+const params = computed(() => ({
+	submissionId: props.submissionId,
+	publicationId: props.publicationId,
+}));
+</script>
diff --git a/src/managers/RepresentativeManager/RepresentativeManager.vue b/src/managers/RepresentativeManager/RepresentativeManager.vue
new file mode 100644
index 000000000..54924a25d
--- /dev/null
+++ b/src/managers/RepresentativeManager/RepresentativeManager.vue
@@ -0,0 +1,19 @@
+<template>
+	<GridWrapper
+		:key="`${submissionId}`"
+		grid-component="grid.catalogEntry.RepresentativesGridHandler"
+		:params="params"
+	></GridWrapper>
+</template>
+<script setup>
+import GridWrapper from '@/components/GridWrapper/GridWrapper.vue';
+import {computed} from 'vue';
+
+const props = defineProps({
+	submissionId: {type: String, required: true},
+});
+
+const params = computed(() => ({
+	submissionId: props.submissionId,
+}));
+</script>
diff --git a/src/pages/dashboard/dashboardPageStore.js b/src/pages/dashboard/dashboardPageStore.js
index 7fbcc04a3..b968826cc 100644
--- a/src/pages/dashboard/dashboardPageStore.js
+++ b/src/pages/dashboard/dashboardPageStore.js
@@ -20,7 +20,6 @@ import {useReviewActivityLogic} from './composables/useReviewActivityLogic';
 import {useSubmission} from '@/composables/useSubmission';
 
 import DashboardModalFilters from '@/pages/dashboard/modals/DashboardModalFilters.vue';
-import Workflow from '@/pages/workflow/Workflow.vue';
 
 const {t, tk} = useLocalize();
 
@@ -330,7 +329,7 @@ export const useDashboardPageStore = defineComponentStore(
 		function openWorkflowModal(submissionId) {
 			queryParamsUrl.workflowSubmissionId = submissionId;
 			openSideModal(
-				Workflow,
+				'WorkflowPage',
 				{
 					submissionId,
 					pageInitConfig,
diff --git a/src/pages/workflow/Workflow.vue b/src/pages/workflow/WorkflowPage.vue
similarity index 51%
rename from src/pages/workflow/Workflow.vue
rename to src/pages/workflow/WorkflowPage.vue
index 23c4a86b7..031e9e804 100644
--- a/src/pages/workflow/Workflow.vue
+++ b/src/pages/workflow/WorkflowPage.vue
@@ -1,7 +1,7 @@
 <template>
 	<SideModalBody>
 		<template #pre-title>
-			{{ submissionId }}
+			{{ workflowStore.submissionId }}
 		</template>
 		<template #title>
 			<span v-if="selectedPublication" class="underline">
@@ -17,7 +17,7 @@
 			}}
 		</template>
 		<template v-if="submission" #post-description>
-			<StageBubble :extended-stage="extendedStage">
+			<StageBubble :extended-stage="workflowStore.extendedStage">
 				<span class="text-lg-normal">
 					{{ stageLabel }}
 				</span>
@@ -26,7 +26,7 @@
 		<template v-if="submission" #actions>
 			<div class="flex gap-x-4">
 				<component
-					:is="Components[item.component] || item.component"
+					:is="workflowStore.Components[item.component] || item.component"
 					v-bind="item.props"
 					v-for="(item, index) in workflowStore.headerItems"
 					:key="`${index} - ${item.component} - ${item?.props?.namespace}`"
@@ -40,7 +40,7 @@
 				</nav>
 			</template>
 			<template #heading>
-				<h2>{{ workflowStore.stageTitle }}</h2>
+				<h2>{{ workflowStore.menuTitle }}</h2>
 			</template>
 			<template
 				v-if="workflowStore.publicationControlsLeft?.length"
@@ -48,7 +48,7 @@
 			>
 				<div class="flex flex-col gap-y-2" data-cy="workflow-controls-left">
 					<component
-						:is="Components[item.component] || item.component"
+						:is="workflowStore.Components[item.component] || item.component"
 						v-bind="item.props"
 						v-for="(item, index) in workflowStore.publicationControlsLeft"
 						:key="`${index} - ${item.component} - ${item?.props?.namespace}`"
@@ -61,7 +61,7 @@
 			>
 				<div class="flex gap-x-3" data-cy="workflow-controls-right">
 					<component
-						:is="Components[item.component] || item.component"
+						:is="workflowStore.Components[item.component] || item.component"
 						v-bind="item.props"
 						v-for="(item, index) in workflowStore.publicationControlsRight"
 						:key="`${index} - ${item.component} - ${item?.props?.namespace}`"
@@ -75,7 +75,7 @@
 					data-cy="workflow-primary-items"
 				>
 					<component
-						:is="Components[item.component] || item.component"
+						:is="workflowStore.Components[item.component] || item.component"
 						v-bind="item.props"
 						v-for="(item, index) in workflowStore.primaryItems"
 						:key="`${index} - ${item.component} - ${item?.props?.namespace}`"
@@ -88,7 +88,7 @@
 					data-cy="workflow-action-items"
 				>
 					<component
-						:is="Components[item.component] || item.component"
+						:is="workflowStore.Components[item.component] || item.component"
 						v-for="(item, index) in workflowStore.actionItems"
 						v-bind="item.props"
 						:key="`${index} - ${item.component} - ${item?.props?.namespace}`"
@@ -101,7 +101,7 @@
 					data-cy="workflow-secondary-items"
 				>
 					<component
-						:is="Components[item.component] || item.component"
+						:is="workflowStore.Components[item.component] || item.component"
 						v-for="(item, index) in workflowStore.secondaryItems"
 						v-bind="item.props"
 						:key="`${index} - ${item.component} - ${item?.props?.namespace}`"
@@ -113,78 +113,18 @@
 </template>
 
 <script setup>
-import {computed} from 'vue';
 import {storeToRefs} from 'pinia';
 import SideMenu from '@/components/SideMenu/SideMenu.vue';
 import SideModalBody from '@/components/Modal/SideModalBody.vue';
 import StageBubble from '@/components/StageBubble/StageBubble.vue';
-import FileManager from '@/managers/FileManager/FileManager.vue';
-import DiscussionManager from '@/managers/DiscussionManager/DiscussionManager.vue';
-import ParticipantManager from '@/managers/ParticipantManager/ParticipantManager.vue';
 
-import ReviewerManager from '@/managers/ReviewerManager/ReviewerManager.vue';
-import ContributorManager from '@/managers/ContributorManager/ContributorManager.vue';
-import WorkflowPrimaryBasicMetadata from './components/primary/WorkflowPrimaryBasicMetadata.vue';
-import WorkflowReviewRoundStatus from './components/primary/WorkflowReviewRoundStatus.vue';
-// Publications
-import WorkflowNotificationDisplay from './components/primary/WorkflowNotificationDisplay.vue';
-import WorkflowPaymentDropdown from './components/header/WorkflowPaymentDropdown.vue';
-import WorkflowPublicationForm from './components/publication/WorkflowPublicationForm.vue';
-import WorkflowPublicationJats from './components/publication/WorkflowPublicationJats.vue';
-import WorkflowPublicationVersionControl from './components/publication/WorkflowPublicationVersionControl.vue';
-import WorkflowChangeSubmissionLanguage from './components/publication/WorkflowChangeSubmissionLanguage.vue';
-
-import WorkflowActionButton from './components/action/WorkflowActionButton.vue';
-import WorkflowRecommendOnlyControls from './components/action/WorkflowRecommendOnlyControls.vue';
-import WorkflowRecommendOnlyListingRecommendations from './components/secondary/WorkflowRecommendOnlyListingRecommendations.vue';
-
-import WorkflowSubmissionStatus from './components/primary/WorkflowSubmissionStatus.vue';
-import GalleyManager from '@/managers/GalleyManager/GalleyManager.vue';
-import WorkflowPublicationEditDisabled from './components/publication/WorkflowPublicationEditDisabled.vue';
 import {useWorkflowStore} from './workflowStore';
 import SideModalLayoutMenu2Columns from '@/components/Modal/SideModalLayoutMenu2Columns.vue';
 
 import {useLocalize} from '@/composables/useLocalize';
-import {useSubmission} from '@/composables/useSubmission';
 const {localizeSubmission} = useLocalize();
 
-const Components = {
-	FileManager,
-	ReviewerManager,
-	DiscussionManager,
-	ContributorManager,
-	ParticipantManager,
-	GalleyManager,
-	WorkflowActionButton,
-	WorkflowRecommendOnlyControls,
-	WorkflowRecommendOnlyListingRecommendations,
-	WorkflowNotificationDisplay,
-	WorkflowPaymentDropdown,
-	WorkflowPrimaryBasicMetadata,
-	WorkflowReviewRoundStatus,
-	WorkflowPublicationForm,
-	WorkflowPublicationJats,
-	WorkflowPublicationVersionControl,
-	WorkflowChangeSubmissionLanguage,
-	WorkflowSubmissionStatus,
-	WorkflowPublicationEditDisabled,
-};
-
-const props = defineProps({
-	submissionId: {type: Number, required: true},
-	pageInitConfig: {type: Object, required: true},
-});
-
-const workflowStore = useWorkflowStore(props);
-
-const {getExtendedStage, getExtendedStageLabel} = useSubmission();
-
-const extendedStage = computed(
-	() => submission.value && getExtendedStage(submission.value),
-);
-const stageLabel = computed(
-	() => submission.value && getExtendedStageLabel(submission.value),
-);
+const workflowStore = useWorkflowStore();
 
 const {submission, selectedPublication} = storeToRefs(workflowStore);
 </script>
diff --git a/src/pages/workflow/WorkflowPageOMP.vue b/src/pages/workflow/WorkflowPageOMP.vue
new file mode 100644
index 000000000..cf73002de
--- /dev/null
+++ b/src/pages/workflow/WorkflowPageOMP.vue
@@ -0,0 +1,15 @@
+<template>
+	<WorkflowPage />
+</template>
+
+<script setup>
+import WorkflowPage from './WorkflowPage.vue';
+import {useWorkflowStore} from './workflowStoreOMP';
+
+const props = defineProps({
+	submissionId: {type: Number, required: true},
+	pageInitConfig: {type: Object, required: true},
+});
+
+useWorkflowStore(props);
+</script>
diff --git a/src/pages/workflow/components/header/WorkflowWorkTypeOMP.vue b/src/pages/workflow/components/header/WorkflowWorkTypeOMP.vue
new file mode 100644
index 000000000..404742945
--- /dev/null
+++ b/src/pages/workflow/components/header/WorkflowWorkTypeOMP.vue
@@ -0,0 +1,52 @@
+<template>
+	<DropdownActions
+		:label="label"
+		:actions="actions"
+		@action="handleAction"
+	></DropdownActions>
+</template>
+
+<script setup>
+import {computed} from 'vue';
+import DropdownActions from '@/components/DropdownActions/DropdownActions.vue';
+import {useLocalize} from '@/composables/useLocalize';
+import {useWorkflowStore} from '@/pages/workflow/workflowStore';
+
+const {t} = useLocalize();
+
+const props = defineProps({submission: {type: Object, required: true}});
+
+const label = computed(() => {
+	if (props.submission.workType === pkp.const['WORK_TYPE_EDITED_VOLUME']) {
+		return t('submission.workflowType.editedVolume.label');
+	}
+	return t('common.publication');
+});
+
+const actions = computed(() => {
+	return [
+		{
+			label: t('submission.workflowType.editedVolume.label'),
+			name: 'setAsEditedVolume',
+		},
+		{
+			label: t('common.publication'),
+			name: 'setAsAuthoredWork',
+		},
+	];
+});
+
+const workflowStore = useWorkflowStore();
+
+function handleAction(actionName) {
+	if (actionName === 'setAsEditedVolume') {
+		workflowStore.workflowChangeWorktype({
+			workType: pkp.const.WORK_TYPE_EDITED_VOLUME,
+		});
+	} else if (actionName === 'setAsAuthoredWork') {
+		workflowStore.workflowChangeWorktype({
+			workType: pkp.const.WORK_TYPE_AUTHORED_WORK,
+		});
+	}
+}
+</script>
diff --git a/src/pages/workflow/components/publication/WorkflowMarketingForm.vue b/src/pages/workflow/components/publication/WorkflowMarketingForm.vue
new file mode 100644
index 000000000..447cdae0b
--- /dev/null
+++ b/src/pages/workflow/components/publication/WorkflowMarketingForm.vue
@@ -0,0 +1,42 @@
+<template>
+	<PkpForm
+		v-if="form"
+		v-bind="form"
+		@set="set"
+		@success="triggerDataChange"
+	></PkpForm>
+</template>
+
+<script setup>
+import {computed, watch} from 'vue';
+import PkpForm from '@/components/Form/Form.vue';
+import {useFetch} from '@/composables/useFetch';
+import {useForm} from '@/composables/useForm';
+import {useUrl} from '@/composables/useUrl';
+import {useDataChanged} from '@/composables/useDataChanged';
+
+const props = defineProps({
+	formName: {type: String, required: true},
+	submission: {type: Object, required: true},
+});
+
+const relativeUrl = computed(() => {
+	// its not publication specific, but its under publications endpoint, therefore selecting publication works correctly
+	return `submissions/${props.submission.id}/publications/${props.submission.publications[0].id}/_components/${props.formName}`;
+});
+
+const {apiUrl: publicationFormUrl} = useUrl(relativeUrl);
+const {data: publicationForm, fetch: fetchForm} = useFetch(publicationFormUrl);
+
+watch(
+	relativeUrl,
+	() => {
+		fetchForm();
+	},
+	{immediate: true},
+);
+
+const {triggerDataChange} = useDataChanged();
+
+const {set, form} = useForm(publicationForm);
+</script>
diff --git a/src/pages/workflow/components/publication/WorkflowPublicationForm.vue b/src/pages/workflow/components/publication/WorkflowPublicationForm.vue
index 27187d8a6..b90c1db0b 100644
--- a/src/pages/workflow/components/publication/WorkflowPublicationForm.vue
+++ b/src/pages/workflow/components/publication/WorkflowPublicationForm.vue
@@ -21,7 +21,7 @@ import {useUrl} from '@/composables/useUrl';
 import {useDataChanged} from '@/composables/useDataChanged';
 
 const props = defineProps({
-	canEditPublication: {type: Boolean, required: true},
+	canEdit: {type: Boolean, required: true},
 	formName: {type: String, required: true},
 	noFieldsMessage: {type: String, required: false, default: null},
 	submission: {type: Object, required: true},
@@ -44,7 +44,7 @@ watch(
 );
 
 watch(publicationForm, (newPublicationForm) => {
-	newPublicationForm.canSubmit = props.canEditPublication;
+	newPublicationForm.canSubmit = props.canEdit;
 });
 
 const displayNoFieldsEnabled = computed(() => {
diff --git a/src/pages/workflow/composables/useWorkflowActions.js b/src/pages/workflow/composables/useWorkflowActions.js
index 17c7219ce..5eefd937d 100644
--- a/src/pages/workflow/composables/useWorkflowActions.js
+++ b/src/pages/workflow/composables/useWorkflowActions.js
@@ -26,6 +26,9 @@ export const Actions = {
 	WORKFLOW_UNPUBLISH_PUBLICATION: 'workflowUnpublishPublication',
 	WORKFLOW_CREATE_NEW_VERSION: 'workflowCreateNewVersion',
 	WORKFLOW_CHANGE_SUBMISSION_LANGUAGE: 'workflowChangeSubmissionLanguage',
+
+	// OMP
+	WORKFLOW_CHANGE_WORKTYPE: 'workflowChangeWorktype',
 };
 
 export function useWorkflowActions({
@@ -308,6 +311,20 @@ export function useWorkflowActions({
 		});
 	}
 
+	async function workflowChangeWorktype(
+		{submission, workType},
+		finishedCallback,
+	) {
+		const {apiUrl} = useUrl(`submissions/${submission.id}`);
+
+		console.log('workType:', workType);
+		const {fetch} = useFetch(apiUrl, {method: 'PUT', body: {workType}});
+
+		await fetch();
+
+		finishedCallback();
+	}
+
 	return {
 		workflowViewPublishedSubmission,
 		workflowAssignToIssue,
@@ -322,5 +339,6 @@ export function useWorkflowActions({
 		workflowCreateNewVersion,
 		workflowPreviewPublication,
 		workflowChangeSubmissionLanguage,
+		workflowChangeWorktype,
 	};
 }
diff --git a/src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOJS.js b/src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOJS.js
new file mode 100644
index 000000000..269655467
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOJS.js
@@ -0,0 +1,156 @@
+import {useLocalize} from '@/composables/useLocalize';
+import {DashboardPageTypes} from '@/pages/dashboard/dashboardPageStore';
+
+import * as ConfigAuthorShared from './workflowConfigAuthorOJS';
+import * as ConfigEditorialShared from './workflowConfigEditorialOJS';
+
+import * as ConfigAuthorOJS from './workflowConfigAuthorOJS';
+import * as ConfigEditorialOJS from './workflowConfigEditorialOJS';
+
+export function useWorkflowConfigOMP({dashboardPage}) {
+	const {t} = useLocalize();
+
+	let Configs = null;
+
+	if (dashboardPage === DashboardPageTypes.EDITORIAL_DASHBOARD) {
+		Configs = {
+			getHeaderItems: ConfigEditorialOJS.getHeaderItems,
+			WorkflowConfig: {
+				...ConfigEditorialShared.WorkflowConfig,
+				...ConfigEditorialOJS.WorkflowConfig,
+			},
+			PublicationConfig: {
+				...ConfigEditorialShared.PublicationConfig,
+				...ConfigEditorialOJS.PublicationConfig,
+			},
+		};
+	} else {
+		Configs = {
+			getHeaderItems: ConfigEditorialOJS.getHeaderItems,
+			WorkflowConfig: {
+				...ConfigAuthorShared.WorkflowConfig,
+				...ConfigAuthorOJS.WorkflowConfig,
+			},
+			PublicationConfig: {
+				...ConfigAuthorShared.PublicationConfig,
+				...ConfigAuthorOJS.PublicationConfig,
+			},
+		};
+	}
+
+	function _getItems(
+		getterFnName,
+		{
+			selectedMenuState,
+			submission,
+			pageInitConfig,
+			selectedPublication,
+			selectedPublicationId,
+			selectedReviewRound,
+			permissions,
+		},
+	) {
+		if (selectedMenuState.stageId) {
+			const itemsArgs = {
+				submission,
+				selectedPublication,
+				selectedPublicationId,
+				selectedStageId: selectedMenuState.stageId,
+				selectedReviewRound,
+				permissions,
+			};
+			if (!submission) {
+				return [];
+			}
+
+			if (!permissions.accessibleStages.includes(selectedMenuState.stageId)) {
+				if (getterFnName === 'getPrimaryItems') {
+					return [
+						{
+							component: 'PrimaryBasicMetadata',
+							props: {body: t('user.authorization.accessibleWorkflowStage')},
+						},
+					];
+				} else {
+					return [];
+				}
+			}
+
+			return [
+				...(Configs.WorkflowConfig?.common?.[getterFnName]?.(itemsArgs) || []),
+				...(Configs.WorkflowConfig[selectedMenuState.stageId]?.[getterFnName]?.(
+					itemsArgs,
+				) || []),
+			];
+		} else if (selectedMenuState.publicationMenu) {
+			const itemsArgs = {
+				submission,
+				pageInitConfig: pageInitConfig,
+				selectedPublication,
+				selectedPublicationId,
+				permissions,
+			};
+			if (!submission || !selectedPublication) {
+				return [];
+			}
+
+			return [
+				...(Configs.PublicationConfig?.common?.[getterFnName]?.(itemsArgs) ||
+					[]),
+				...(Configs.PublicationConfig[selectedMenuState.publicationMenu]?.[
+					getterFnName
+				]?.(itemsArgs) || []),
+			];
+		} else if (selectedMenuState.marketingMenu) {
+			const itemsArgs = {
+				submission,
+				pageInitConfig: pageInitConfig,
+				permissions,
+			};
+
+			if (!submission) {
+				return [];
+			}
+
+			return [
+				...(Configs.MarketingConfig?.common?.[getterFnName]?.(itemsArgs) || []),
+				...(Configs.MarketingConfig[selectedMenuState.marketingMenu]?.[
+					getterFnName
+				]?.(itemsArgs) || []),
+			];
+		}
+	}
+
+	function getHeaderItems(args) {
+		return Configs.getHeaderItems(args);
+	}
+
+	function getPrimaryItems(args) {
+		return _getItems('getPrimaryItems', args);
+	}
+
+	function getSecondaryItems(args) {
+		return _getItems('getSecondaryItems', args);
+	}
+
+	function getActionItems(args) {
+		return _getItems('getActionItems', args);
+	}
+
+	function getPublicationControlsLeft(args) {
+		return _getItems('getPublicationControlsLeft', args);
+	}
+
+	function getPublicationControlsRight(args) {
+		return _getItems('getPublicationControlsRight', args);
+	}
+
+	return {
+		getHeaderItems,
+		getPrimaryItems,
+		getSecondaryItems,
+		getActionItems,
+		getPublicationControlsLeft,
+		getPublicationControlsRight,
+	};
+}
diff --git a/src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOMP.js b/src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOMP.js
new file mode 100644
index 000000000..24b29d1e4
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowConfig/useWorkflowConfigOMP.js
@@ -0,0 +1,157 @@
+import {useLocalize} from '@/composables/useLocalize';
+import {DashboardPageTypes} from '@/pages/dashboard/dashboardPageStore';
+
+import * as ConfigAuthorShared from './workflowConfigAuthorOJS';
+import * as ConfigEditorialShared from './workflowConfigEditorialOJS';
+
+import * as ConfigAuthorOMP from './workflowConfigAuthorOMP';
+import * as ConfigEditorialOMP from './workflowConfigEditorialOMP';
+
+export function useWorkflowConfigOMP({dashboardPage}) {
+	const {t} = useLocalize();
+
+	let Configs = null;
+
+	if (dashboardPage === DashboardPageTypes.EDITORIAL_DASHBOARD) {
+		Configs = {
+			getHeaderItems: ConfigEditorialOMP.getHeaderItems,
+			WorkflowConfig: {
+				...ConfigEditorialShared.WorkflowConfig,
+				...ConfigEditorialOMP.WorkflowConfig,
+			},
+			PublicationConfig: {
+				...ConfigEditorialShared.PublicationConfig,
+				...ConfigEditorialOMP.PublicationConfig,
+			},
+			MarketingConfig: ConfigEditorialOMP.MarketingConfig,
+		};
+	} else {
+		Configs = {
+			getHeaderItems: ConfigEditorialOMP.getHeaderItems,
+			WorkflowConfig: {
+				...ConfigAuthorShared.WorkflowConfig,
+				...ConfigAuthorOMP.WorkflowConfig,
+			},
+			PublicationConfig: {
+				...ConfigAuthorShared.PublicationConfig,
+				...ConfigAuthorOMP.PublicationConfig,
+			},
+		};
+	}
+
+	function _getItems(
+		getterFnName,
+		{
+			selectedMenuState,
+			submission,
+			pageInitConfig,
+			selectedPublication,
+			selectedPublicationId,
+			selectedReviewRound,
+			permissions,
+		},
+	) {
+		if (selectedMenuState.stageId) {
+			const itemsArgs = {
+				submission,
+				selectedPublication,
+				selectedPublicationId,
+				selectedStageId: selectedMenuState.stageId,
+				selectedReviewRound,
+				permissions,
+			};
+			if (!submission) {
+				return [];
+			}
+
+			if (!permissions.accessibleStages.includes(selectedMenuState.stageId)) {
+				if (getterFnName === 'getPrimaryItems') {
+					return [
+						{
+							component: 'PrimaryBasicMetadata',
+							props: {body: t('user.authorization.accessibleWorkflowStage')},
+						},
+					];
+				} else {
+					return [];
+				}
+			}
+
+			return [
+				...(Configs.WorkflowConfig?.common?.[getterFnName]?.(itemsArgs) || []),
+				...(Configs.WorkflowConfig[selectedMenuState.stageId]?.[getterFnName]?.(
+					itemsArgs,
+				) || []),
+			];
+		} else if (selectedMenuState.primaryMenuItem === 'publication') {
+			const itemsArgs = {
+				submission,
+				pageInitConfig: pageInitConfig,
+				selectedPublication,
+				selectedPublicationId,
+				permissions,
+			};
+			if (!submission || !selectedPublication) {
+				return [];
+			}
+
+			return [
+				...(Configs.PublicationConfig?.common?.[getterFnName]?.(itemsArgs) ||
+					[]),
+				...(Configs.PublicationConfig[selectedMenuState.secondaryMenuItem]?.[
+					getterFnName
+				]?.(itemsArgs) || []),
+			];
+		} else if (selectedMenuState.primaryMenuItem === 'marketing') {
+			const itemsArgs = {
+				submission,
+				pageInitConfig: pageInitConfig,
+				permissions,
+			};
+
+			if (!submission) {
+				return [];
+			}
+
+			return [
+				...(Configs.MarketingConfig?.common?.[getterFnName]?.(itemsArgs) || []),
+				...(Configs.MarketingConfig[selectedMenuState.secondaryMenuItem]?.[
+					getterFnName
+				]?.(itemsArgs) || []),
+			];
+		}
+	}
+
+	function getHeaderItems(args) {
+		return Configs.getHeaderItems(args);
+	}
+
+	function getPrimaryItems(args) {
+		return _getItems('getPrimaryItems', args);
+	}
+
+	function getSecondaryItems(args) {
+		return _getItems('getSecondaryItems', args);
+	}
+
+	function getActionItems(args) {
+		return _getItems('getActionItems', args);
+	}
+
+	function getPublicationControlsLeft(args) {
+		return _getItems('getPublicationControlsLeft', args);
+	}
+
+	function getPublicationControlsRight(args) {
+		return _getItems('getPublicationControlsRight', args);
+	}
+
+	return {
+		getHeaderItems,
+		getPrimaryItems,
+		getSecondaryItems,
+		getActionItems,
+		getPublicationControlsLeft,
+		getPublicationControlsRight,
+	};
+}
diff --git a/src/pages/workflow/composables/useWorkflowConfig/workflowConfigAuthorOJS.js b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigAuthorOJS.js
new file mode 100644
index 000000000..40761d9a2
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigAuthorOJS.js
@@ -0,0 +1,361 @@
+import {useLocalize} from '@/composables/useLocalize';
+import {Actions} from '../useWorkflowActions';
+import {useSubmission} from '@/composables/useSubmission';
+
+const {hasSubmissionPassedStage, getOpenReviewAssignmentsForRound} =
+	useSubmission();
+
+const {t} = useLocalize();
+
+export function getHeaderItems({
+	submission,
+	selectedPublication,
+	publicationSettings,
+}) {
+	if (!submission) {
+		return [];
+	}
+	const {t} = useLocalize();
+	const actions = [];
+
+	actions.push({
+		component: 'WorkflowActionButton',
+		props: {
+			label: t('editor.submissionLibrary'),
+			action: Actions.WORKFLOW_VIEW_LIBRARY,
+		},
+	});
+
+	return actions;
+}
+
+export const WorkflowConfig = {
+	common: {
+		getPrimaryItems: ({submission, permissions}) => {
+			return [
+				{
+					component: 'WorkflowChangeSubmissionLanguage',
+					props: {
+						submission,
+						canChangeSubmissionLanguage: false,
+					},
+				},
+			];
+		},
+		getSecondaryItems: ({submission, selectedReviewRound, selectedStageId}) => {
+			const items = [];
+			return items;
+		},
+		getActionsItems: ({submission, selectedReviewRound, selectedStageId}) => {
+			const items = [];
+			return items;
+		},
+	},
+	[pkp.const.WORKFLOW_STAGE_ID_SUBMISSION]: {
+		getPrimaryItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+
+			if (
+				hasSubmissionPassedStage(
+					submission,
+					pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
+				)
+			) {
+				items.push({component: 'SubmissionStatus', props: {submission}});
+			}
+
+			items.push({
+				component: 'FileManager',
+				props: {
+					namespace: 'SUBMISSION_FILES',
+					submission: submission,
+					submissionStageId: submission.stageId,
+				},
+			});
+
+			items.push({
+				component: 'DiscussionManager',
+				props: {submissionId: submission.id, stageId: selectedStageId},
+			});
+
+			return items;
+		},
+	},
+
+	[pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW]: {
+		getPrimaryItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+			if (!selectedReviewRound) {
+				return [
+					{
+						component: 'WorkflowPrimaryBasicMetadata',
+						props: {body: t('editor.review.notInitiated')},
+					},
+				];
+			}
+			const {getCurrentReviewRound} = useSubmission();
+
+			const currentReviewRound = getCurrentReviewRound(
+				submission,
+				selectedStageId,
+			);
+
+			if (selectedReviewRound.round < currentReviewRound.round) {
+				items.push({
+					component: 'WorkflowPrimaryBasicMetadata',
+					props: {
+						body: t(
+							'editor.submission.workflowDecision.submission.reviewRound',
+						),
+					},
+				});
+			}
+
+			if (selectedReviewRound.id === currentReviewRound.id) {
+				items.push({
+					component: 'WorkflowReviewRoundStatus',
+					props: {reviewRound: selectedReviewRound},
+				});
+			}
+
+			if (
+				getOpenReviewAssignmentsForRound(
+					submission.reviewAssignments,
+					selectedReviewRound.id,
+				).length
+			) {
+				items.push({
+					component: 'ReviewerManager',
+					props: {
+						submission: submission,
+						reviewRoundId: selectedReviewRound?.id,
+						redactedForAuthors: true,
+					},
+				});
+			}
+			items.push({
+				component: 'FileManager',
+				props: {
+					namespace: 'WORKFLOW_REVIEW_REVISIONS',
+					submission: submission,
+					submissionStageId: submission.stageId,
+					reviewRoundId: selectedReviewRound?.id,
+				},
+			});
+
+			items.push({
+				component: 'DiscussionManager',
+				props: {
+					submissionId: submission.id,
+					stageId: selectedStageId,
+				},
+			});
+
+			return items;
+		},
+	},
+	[pkp.const.WORKFLOW_STAGE_ID_EDITING]: {
+		getPrimaryItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+
+			if (
+				hasSubmissionPassedStage(
+					submission,
+					pkp.const.WORKFLOW_STAGE_ID_EDITING,
+				)
+			) {
+				items.push({
+					component: 'WorkflowPrimaryBasicMetadata',
+					props: {
+						body: t('editor.submission.workflowDecision.submission.production'),
+					},
+				});
+			}
+
+			items.push({
+				component: 'DiscussionManager',
+				props: {
+					submissionId: submission.id,
+					stageId: selectedStageId,
+				},
+			});
+
+			items.push({
+				component: 'FileManager',
+				props: {
+					namespace: 'COPYEDITED_FILES',
+					submission: submission,
+					submissionStageId: submission.stageId,
+				},
+			});
+
+			return items;
+		},
+	},
+	[pkp.const.WORKFLOW_STAGE_ID_PRODUCTION]: {
+		getPrimaryItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+			if (submission.status === pkp.const.STATUS_PUBLISHED) {
+				items.push({
+					component: 'WorkflowPrimaryBasicMetadata',
+					props: {
+						body: t('editor.submission.workflowDecision.submission.published'),
+					},
+				});
+			}
+
+			items.push({
+				component: 'WorkflowNotificationDisplay',
+				props: {submission: submission},
+			});
+
+			items.push({
+				component: 'DiscussionManager',
+				props: {
+					submissionId: submission.id,
+					stageId: selectedStageId,
+				},
+			});
+
+			return items;
+		},
+	},
+};
+
+export const PublicationConfig = {
+	common: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublicationId,
+			selectedPublication,
+		}) => {
+			const items = [];
+			if (selectedPublication.status === pkp.const.STATUS_PUBLISHED) {
+				items.push({
+					component: 'WorkflowPublicationEditDisabled',
+					props: {},
+				});
+			}
+			return items;
+		},
+		getPublicationControlsLeft: ({
+			submission,
+			selectedPublicationId,
+			selectedPublication,
+		}) => {
+			const items = [];
+
+			items.push({
+				component: 'WorkflowPublicationVersionControl',
+				props: {
+					submission,
+					selectedPublicationId: selectedPublicationId,
+				},
+			});
+
+			return items;
+		},
+		getPublicationControlsRight: ({
+			submission,
+			selectedPublicationId,
+			selectedPublication,
+		}) => {
+			const items = [];
+			return items;
+		},
+	},
+	titleAbstract: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'titleAbstract',
+						submission,
+						publication: selectedPublication,
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+	contributors: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'ContributorManager',
+					props: {
+						submission: submission,
+						publication: selectedPublication,
+						contributorForm: pageInitConfig.contributorForm,
+					},
+				},
+			];
+		},
+	},
+	metadata: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'metadata',
+						submission,
+						publication: selectedPublication,
+						noFieldsMessage: 'No metadata fields are currently enabled.',
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+	citations: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'reference',
+						submission,
+						publication: selectedPublication,
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+	galleys: {
+		getPrimaryItems: ({submission, selectedPublication, permissions}) => {
+			return [
+				{
+					component: 'GalleyManager',
+					props: {
+						submission,
+						publication: selectedPublication,
+						canEditPublication: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+};
diff --git a/src/pages/workflow/composables/useWorkflowAuthorConfig.js b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigAuthorOMP.js
similarity index 75%
rename from src/pages/workflow/composables/useWorkflowAuthorConfig.js
rename to src/pages/workflow/composables/useWorkflowConfig/workflowConfigAuthorOMP.js
index 8101db906..ef98ee477 100644
--- a/src/pages/workflow/composables/useWorkflowAuthorConfig.js
+++ b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigAuthorOMP.js
@@ -1,5 +1,5 @@
 import {useLocalize} from '@/composables/useLocalize';
-import {Actions} from './useWorkflowActions';
+import {Actions} from '../useWorkflowActions';
 import {useSubmission} from '@/composables/useSubmission';
 
 const {hasSubmissionPassedStage, getOpenReviewAssignmentsForRound} =
@@ -7,7 +7,7 @@ const {hasSubmissionPassedStage, getOpenReviewAssignmentsForRound} =
 
 const {t} = useLocalize();
 
-function getHeaderItems({
+export function getHeaderItems({
 	submission,
 	selectedPublication,
 	publicationSettings,
@@ -278,7 +278,7 @@ export const PublicationConfig = {
 						formName: 'titleAbstract',
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -303,6 +303,25 @@ export const PublicationConfig = {
 			];
 		},
 	},
+	chapters: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'ChapterManager',
+					props: {
+						submissionId: submission.id,
+						publicationId: selectedPublication.id,
+					},
+				},
+			];
+		},
+	},
+
 	metadata: {
 		getPrimaryItems: ({
 			submission,
@@ -318,7 +337,7 @@ export const PublicationConfig = {
 						submission,
 						publication: selectedPublication,
 						noFieldsMessage: 'No metadata fields are currently enabled.',
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -338,7 +357,7 @@ export const PublicationConfig = {
 						formName: 'reference',
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -352,108 +371,10 @@ export const PublicationConfig = {
 					props: {
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
 		},
 	},
 };
-
-export function useWorkflowAuthorConfig() {
-	function _getItems(
-		getterFnName,
-		{
-			selectedMenuState,
-			submission,
-			pageInitConfig,
-			selectedPublication,
-			selectedPublicationId,
-			selectedReviewRound,
-			permissions,
-		},
-	) {
-		if (selectedMenuState.stageId) {
-			const itemsArgs = {
-				submission,
-				selectedPublication,
-				selectedPublicationId,
-				selectedStageId: selectedMenuState.stageId,
-				selectedReviewRound,
-				permissions,
-			};
-			if (!submission) {
-				return [];
-			}
-
-			if (!permissions.accessibleStages.includes(selectedMenuState.stageId)) {
-				if (getterFnName === 'getPrimaryItems') {
-					return [
-						{
-							component: 'PrimaryBasicMetadata',
-							props: {
-								body: t('user.authorization.accessibleWorkflowStage'),
-							},
-						},
-					];
-				} else {
-					return [];
-				}
-			}
-
-			return [
-				...(WorkflowConfig?.common?.[getterFnName]?.(itemsArgs) || []),
-				...(WorkflowConfig[selectedMenuState.stageId]?.[getterFnName]?.(
-					itemsArgs,
-				) || []),
-			];
-		} else if (selectedMenuState.publicationMenu) {
-			const itemsArgs = {
-				submission,
-				pageInitConfig: pageInitConfig,
-				selectedPublication,
-				selectedPublicationId,
-				permissions,
-			};
-			if (!submission || !selectedPublication) {
-				return [];
-			}
-
-			return [
-				...(PublicationConfig?.common?.[getterFnName]?.(itemsArgs) || []),
-				...(PublicationConfig[selectedMenuState.publicationMenu]?.[
-					getterFnName
-				]?.(itemsArgs) || []),
-			];
-		}
-	}
-
-	function getPrimaryItems(args) {
-		return _getItems('getPrimaryItems', args);
-	}
-
-	function getSecondaryItems(args) {
-		return _getItems('getSecondaryItems', args);
-	}
-
-	function getActionItems(args) {
-		return _getItems('getActionItems', args);
-	}
-
-	function getPublicationControlsLeft(args) {
-		return _getItems('getPublicationControlsLeft', args);
-	}
-
-	function getPublicationControlsRight(args) {
-		return _getItems('getPublicationControlsRight', args);
-	}
-
-	return {
-		getHeaderItems,
-		getPrimaryItems,
-		getSecondaryItems,
-		getActionItems,
-		getPublicationControlsLeft,
-		getPublicationControlsRight,
-	};
-}
diff --git a/src/pages/workflow/composables/useWorkflowEditorialConfig.js b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigEditorialOJS.js
similarity index 86%
rename from src/pages/workflow/composables/useWorkflowEditorialConfig.js
rename to src/pages/workflow/composables/useWorkflowConfig/workflowConfigEditorialOJS.js
index d272a3fbe..c39e09c57 100644
--- a/src/pages/workflow/composables/useWorkflowEditorialConfig.js
+++ b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigEditorialOJS.js
@@ -1,14 +1,13 @@
 import {useLocalize} from '@/composables/useLocalize';
-import {Actions} from './useWorkflowActions';
+import {Actions} from '../useWorkflowActions';
 import {useSubmission} from '@/composables/useSubmission';
-import {Actions as WorkflowActions} from './useWorkflowActions';
-import {Actions as DecisionActions} from './useWorkflowDecisions';
-
+import {Actions as WorkflowActions} from '../useWorkflowActions';
+import {Actions as DecisionActions} from '../useWorkflowDecisions';
 const {hasSubmissionPassedStage, hasNotSubmissionStartedStage, getStageById} =
 	useSubmission();
 const {t} = useLocalize();
 
-function getHeaderItems({
+export function getHeaderItems({
 	submission,
 	selectedPublication,
 	publicationSettings,
@@ -683,7 +682,7 @@ export const PublicationConfig = {
 						formName: 'titleAbstract',
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -703,7 +702,7 @@ export const PublicationConfig = {
 						submission: submission,
 						publication: selectedPublication,
 						contributorForm: pageInitConfig.contributorForm,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -724,7 +723,7 @@ export const PublicationConfig = {
 						submission,
 						publication: selectedPublication,
 						noFieldsMessage: 'No metadata fields are currently enabled.',
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -744,7 +743,7 @@ export const PublicationConfig = {
 						formName: 'reference',
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -764,7 +763,7 @@ export const PublicationConfig = {
 						formName: 'identifier',
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -781,7 +780,7 @@ export const PublicationConfig = {
 				{
 					component: 'WorkflowPublicationJats',
 					props: {
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 						submission,
 						publication: selectedPublication,
 					},
@@ -797,7 +796,7 @@ export const PublicationConfig = {
 					props: {
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -817,7 +816,7 @@ export const PublicationConfig = {
 						formName: 'permissionDisclosure',
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
@@ -837,106 +836,10 @@ export const PublicationConfig = {
 						formName: 'issue',
 						submission,
 						publication: selectedPublication,
-						canEditPublication: permissions.canEditPublication,
+						canEdit: permissions.canEditPublication,
 					},
 				},
 			];
 		},
 	},
 };
-
-export function useWorkflowEditorialConfig() {
-	function _getItems(
-		getterFnName,
-		{
-			selectedMenuState,
-			submission,
-			pageInitConfig,
-			selectedPublication,
-			selectedPublicationId,
-			selectedReviewRound,
-			permissions,
-		},
-	) {
-		if (selectedMenuState.stageId) {
-			const itemsArgs = {
-				submission,
-				selectedPublication,
-				selectedPublicationId,
-				selectedStageId: selectedMenuState.stageId,
-				selectedReviewRound,
-				permissions,
-			};
-			if (!submission) {
-				return [];
-			}
-
-			if (!permissions.accessibleStages.includes(selectedMenuState.stageId)) {
-				if (getterFnName === 'getPrimaryItems') {
-					return [
-						{
-							component: 'PrimaryBasicMetadata',
-							props: {body: t('user.authorization.accessibleWorkflowStage')},
-						},
-					];
-				} else {
-					return [];
-				}
-			}
-
-			return [
-				...(WorkflowConfig?.common?.[getterFnName]?.(itemsArgs) || []),
-				...(WorkflowConfig[selectedMenuState.stageId]?.[getterFnName]?.(
-					itemsArgs,
-				) || []),
-			];
-		} else if (selectedMenuState.publicationMenu) {
-			const itemsArgs = {
-				submission,
-				pageInitConfig: pageInitConfig,
-				selectedPublication,
-				selectedPublicationId,
-				permissions,
-			};
-			if (!submission || !selectedPublication) {
-				return [];
-			}
-
-			return [
-				...(PublicationConfig?.common?.[getterFnName]?.(itemsArgs) || []),
-				...(PublicationConfig[selectedMenuState.publicationMenu]?.[
-					getterFnName
-				]?.(itemsArgs) || []),
-			];
-		}
-	}
-
-	function getPrimaryItems(args) {
-		return _getItems('getPrimaryItems', args);
-	}
-
-	function getSecondaryItems(args) {
-		return _getItems('getSecondaryItems', args);
-	}
-
-	function getActionItems(args) {
-		return _getItems('getActionItems', args);
-	}
-
-	function getPublicationControlsLeft(args) {
-		return _getItems('getPublicationControlsLeft', args);
-	}
-
-	function getPublicationControlsRight(args) {
-		return _getItems('getPublicationControlsRight', args);
-	}
-
-	return {
-		getHeaderItems,
-		getPrimaryItems,
-		getSecondaryItems,
-		getActionItems,
-		getPublicationControlsLeft,
-		getPublicationControlsRight,
-	};
-}
diff --git a/src/pages/workflow/composables/useWorkflowConfig/workflowConfigEditorialOMP.js b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigEditorialOMP.js
new file mode 100644
index 000000000..7e9db89e8
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowConfig/workflowConfigEditorialOMP.js
@@ -0,0 +1,707 @@
+import {useLocalize} from '@/composables/useLocalize';
+import {Actions} from '../useWorkflowActions';
+import {useSubmission} from '@/composables/useSubmission';
+import {Actions as DecisionActions} from '../useWorkflowDecisions';
+
+const {hasSubmissionPassedStage, hasNotSubmissionStartedStage, getStageById} =
+	useSubmission();
+const {t} = useLocalize();
+export function getHeaderItems({
+	submission,
+	selectedPublication,
+	publicationSettings,
+	permissions,
+}) {
+	if (!submission) {
+		return [];
+	}
+	const {t} = useLocalize();
+	const items = [];
+
+	items.push({
+		component: 'WorkflowWorkTypeOMP',
+		props: {
+			submission: submission,
+		},
+	});
+
+	if (submission.status === pkp.const.STATUS_PUBLISHED) {
+		items.push({
+			component: 'WorkflowActionButton',
+			props: {
+				label: t('common.view'),
+				action: Actions.WORKFLOW_VIEW_PUBLISHED_SUBMISSION,
+			},
+		});
+	}
+
+	if (permissions.canAccessEditorialHistory) {
+		items.push({
+			component: 'WorkflowActionButton',
+			props: {
+				label: t('editor.activityLog'),
+				action: Actions.WORKFLOW_VIEW_ACTIVITY_LOG,
+			},
+		});
+	}
+	items.push({
+		component: 'WorkflowActionButton',
+		props: {
+			label: t('editor.submissionLibrary'),
+			action: Actions.WORKFLOW_VIEW_LIBRARY,
+		},
+	});
+
+	return items;
+}
+
+export const WorkflowConfig = {
+	[pkp.const.WORKFLOW_STAGE_ID_SUBMISSION]: {
+		getPrimaryItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+
+			if (
+				hasSubmissionPassedStage(
+					submission,
+					pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
+				)
+			) {
+				items.push({component: 'SubmissionStatus', props: {submission}});
+			}
+
+			items.push({
+				component: 'FileManager',
+				props: {
+					namespace: 'SUBMISSION_FILES',
+					submission: submission,
+					submissionStageId: selectedStageId,
+				},
+			});
+
+			items.push({
+				component: 'DiscussionManager',
+				props: {submissionId: submission.id, stageId: selectedStageId},
+			});
+
+			return items;
+		},
+		getSecondaryItems: ({submission, selectedReviewRound, selectedStageId}) => {
+			const items = [];
+			items.push({
+				component: 'ParticipantManager',
+				props: {
+					submission,
+					submissionStageId: selectedStageId,
+				},
+			});
+
+			return items;
+		},
+
+		getActionItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+			if (
+				hasSubmissionPassedStage(
+					submission,
+					pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
+				)
+			) {
+				return [];
+			}
+
+			items.push({
+				component: 'WorkflowActionButton',
+				props: {
+					label: t('editor.submission.decision.sendExternalReview'),
+					isPrimary: true,
+					action: DecisionActions.DECISION_SKIP_EXTERNAL_REVIEW,
+				},
+			});
+
+			items.push({
+				component: 'WorkflowActionButton',
+				props: {
+					label: t('editor.submission.decision.skipReview'),
+					isSecondary: true,
+					action: DecisionActions.DECISION_SKIP_EXTERNAL_REVIEW,
+				},
+			});
+
+			items.push({
+				component: 'WorkflowActionButton',
+				props: {
+					label: t('editor.submission.decision.decline'),
+					isWarnable: true,
+					action: DecisionActions.DECISION_INITIAL_DECLINE,
+				},
+			});
+
+			items.push({
+				component: 'WorkflowActionButton',
+				props: {
+					label: t('editor.submission.decision.sendInternalReview'),
+					isSecondary: true,
+					action: DecisionActions.DECISION_INTERNAL_REVIEW,
+				},
+			});
+
+			return items;
+		},
+	},
+	[pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW]: {
+		getPrimaryItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+			if (!selectedReviewRound) {
+				return [
+					{
+						component: 'WorkflowPrimaryBasicMetadata',
+						props: {body: t('editor.review.notInitiated')},
+					},
+				];
+			}
+			const {getCurrentReviewRound} = useSubmission();
+
+			const currentReviewRound = getCurrentReviewRound(
+				submission,
+				selectedStageId,
+			);
+
+			if (selectedReviewRound.round < currentReviewRound.round) {
+				items.push({
+					component: 'WorkflowPrimaryBasicMetadata',
+					props: {
+						body: t(
+							'editor.submission.workflowDecision.submission.reviewRound',
+						),
+					},
+				});
+			}
+
+			if (selectedReviewRound.id === currentReviewRound.id) {
+				items.push({
+					component: 'WorkflowReviewRoundStatus',
+					props: {reviewRound: selectedReviewRound},
+				});
+			}
+
+			items.push({
+				component: 'FileManager',
+				props: {
+					namespace: 'WORKFLOW_REVIEW_REVISIONS',
+					submission: submission,
+					submissionStageId: selectedStageId,
+					reviewRoundId: selectedReviewRound?.id,
+				},
+			});
+
+			items.push({
+				component: 'FileManager',
+				props: {
+					namespace: 'EDITOR_REVIEW_FILES',
+					submission: submission,
+					submissionStageId: selectedStageId,
+					reviewRoundId: selectedReviewRound?.id,
+				},
+			});
+
+			items.push({
+				component: 'ReviewerManager',
+				props: {
+					submission: submission,
+					reviewRoundId: selectedReviewRound?.id,
+				},
+			});
+
+			items.push({
+				component: 'DiscussionManager',
+				props: {
+					submissionId: submission.id,
+					stageId: selectedStageId,
+				},
+			});
+
+			return items;
+		},
+		getSecondaryItems: ({submission, selectedReviewRound, selectedStageId}) => {
+			const items = [];
+
+			// TODO add isDecidingEditor boolean to api to make it more accurate
+			const selectedStage = getStageById(submission, selectedStageId);
+			const isRecommendOnlyEditor = selectedStage.currentUserCanRecommendOnly;
+			if (!isRecommendOnlyEditor) {
+				items.push({
+					component: 'WorkflowRecommendOnlyListingRecommendations',
+					props: {
+						submission: submission,
+						stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+						reviewRoundId: selectedReviewRound.id,
+					},
+				});
+			}
+			items.push({
+				component: 'ParticipantManager',
+				props: {
+					submission,
+					submissionStageId: selectedStageId,
+				},
+			});
+
+			return items;
+		},
+		getActionItems: ({submission, selectedStageId, selectedReviewRound}) => {
+			const items = [];
+			const {getCurrentReviewRound} = useSubmission();
+
+			const currentReviewRound = getCurrentReviewRound(
+				submission,
+				selectedStageId,
+			);
+
+			// if review stage has not started show no items
+			if (
+				hasNotSubmissionStartedStage(
+					submission,
+					pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW,
+				) ||
+				hasSubmissionPassedStage(
+					submission,
+					pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW,
+				) ||
+				selectedReviewRound.round < currentReviewRound.round
+			) {
+				return [];
+			}
+
+			const selectedStage = getStageById(submission, selectedStageId);
+
+			const isRecommendOnlyEditor = selectedStage.currentUserCanRecommendOnly;
+			if (isRecommendOnlyEditor) {
+				items.push({
+					component: 'WorkflowRecommendOnlyControls',
+					props: {
+						submission: submission,
+						userId: pkp.currentUser.id,
+						stageId: pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW,
+						reviewRoundId: selectedReviewRound.id,
+					},
+				});
+			} else {
+				const actionArgs = {
+					stageId: pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW,
+					reviewRoundId: selectedReviewRound.id,
+				};
+
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('dashboard.summary.requestRevisions'),
+						isSecondary: true,
+						action: DecisionActions.DECISION_PENDING_REVISIONS_INTERNAL,
+						actionArgs,
+					},
+				});
+
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('editor.submission.decision.sendExternalReview'),
+						action: DecisionActions.DECISION_EXTERNAL_REVIEW,
+						isPrimary: true,
+						actionArgs,
+					},
+				});
+
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('editor.submission.decision.accept'),
+						action: DecisionActions.DECISION_ACCEPT_INTERNAL,
+						actionArgs,
+					},
+				});
+
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('editor.submission.decision.cancelReviewRound'),
+						isWarnable: true,
+						action: DecisionActions.DECISION_CANCEL_INTERNAL_REVIEW_ROUND,
+						actionArgs,
+					},
+				});
+
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('editor.submission.decision.decline'),
+						isWarnable: true,
+						action: DecisionActions.DECISION_DECLINE_INTERNAL,
+						actionArgs,
+					},
+				});
+			}
+			return items;
+		},
+	},
+};
+
+export const MarketingConfig = {
+	audience: {
+		getPrimaryItems: ({submission, pageInitConfig, permissions}) => {
+			return [
+				{
+					component: 'WorkflowMarketingForm',
+					props: {
+						formName: 'audience',
+						submission,
+					},
+				},
+			];
+		},
+	},
+	representatives: {
+		getPrimaryItems: ({submission, pageInitConfig, permissions}) => {
+			return [
+				{
+					component: 'RepresentativeManager',
+					props: {
+						submissionId: submission.id,
+					},
+				},
+			];
+		},
+	},
+	publicationDates: {
+		getPrimaryItems: ({submission, pageInitConfig, permissions}) => {
+			return [
+				{
+					component: 'WorkflowMarketingForm',
+					props: {
+						formName: 'publicationDates',
+						submission,
+					},
+				},
+			];
+		},
+	},
+};
+
+export const PublicationConfig = {
+	common: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublicationId,
+			selectedPublication,
+		}) => {
+			const items = [];
+			if (selectedPublication.status === pkp.const.STATUS_PUBLISHED) {
+				items.push({
+					component: 'WorkflowPublicationEditDisabled',
+					props: {},
+				});
+			}
+			return items;
+		},
+		getPublicationControlsLeft: ({
+			submission,
+			selectedPublicationId,
+			selectedPublication,
+			permissions,
+		}) => {
+			const items = [];
+
+			if (
+				submission.status !== pkp.const.STATUS_PUBLISHED &&
+				submission.publications.length < 2
+			) {
+				items.push({
+					component: 'WorkflowChangeSubmissionLanguage',
+					props: {
+						submission,
+						canChangeSubmissionLanguage:
+							permissions.canChangeSubmissionLanguage,
+					},
+				});
+			}
+
+			items.push({
+				component: 'WorkflowPublicationVersionControl',
+				props: {
+					submission,
+					selectedPublicationId: selectedPublicationId,
+				},
+			});
+
+			return items;
+		},
+		getPublicationControlsRight: ({
+			submission,
+			selectedPublicationId,
+			selectedPublication,
+			permissions,
+		}) => {
+			const items = [];
+			const {t} = useLocalize();
+
+			if (!permissions.canPublish) {
+				return [];
+			}
+			if (selectedPublication.status === pkp.const.STATUS_QUEUED) {
+				if (
+					hasSubmissionPassedStage(
+						submission,
+						pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+					)
+				) {
+					items.push({
+						component: 'WorkflowActionButton',
+						props: {
+							label: t('common.preview'),
+							isSecondary: true,
+							action: Actions.WORKFLOW_PREVIEW_PUBLICATION,
+						},
+					});
+				}
+
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						// 	{{ submission.status === getConstant('STATUS_PUBLISHED') ? publishLabel : schedulePublicationLabel }}
+
+						label:
+							submission.status === pkp.const.STATUS_PUBLISHED
+								? t('publication.publish')
+								: t('editor.submission.schedulePublication'),
+						isSecondary: true,
+						action:
+							Actions.WORKFLOW_ASSIGN_TO_ISSUE_AND_SCHEDULE_FOR_PUBLICATION,
+					},
+				});
+			} else if (selectedPublication.status === pkp.const.STATUS_SCHEDULED) {
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('dashboard.summary.preview'),
+						isSecondary: true,
+						action: Actions.WORKFLOW_PREVIEW_PUBLICATION,
+					},
+				});
+
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('publication.unschedule'),
+						isWarnable: true,
+						action: Actions.WORKFLOW_UNSCHEDULE_PUBLICATION,
+					},
+				});
+			} else if (selectedPublication.status === pkp.const.STATUS_PUBLISHED) {
+				items.push({
+					component: 'WorkflowActionButton',
+					props: {
+						label: t('publication.unpublish'),
+						isWarnable: true,
+						action: Actions.WORKFLOW_UNPUBLISH_PUBLICATION,
+					},
+				});
+
+				const {getLatestPublication} = useSubmission();
+				const latestPublication = getLatestPublication(submission);
+
+				if (latestPublication.id === selectedPublication.id) {
+					items.push({
+						component: 'WorkflowActionButton',
+						props: {
+							label: t('publication.createVersion'),
+							isSecondary: true,
+							action: Actions.WORKFLOW_CREATE_NEW_VERSION,
+						},
+					});
+				}
+			}
+
+			return items;
+		},
+	},
+	titleAbstract: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'titleAbstract',
+						submission,
+						publication: selectedPublication,
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+	contributors: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'ContributorManager',
+					props: {
+						submission: submission,
+						publication: selectedPublication,
+						contributorForm: pageInitConfig.contributorForm,
+						canEditPublication: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+	chapters: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'ChapterManager',
+					props: {
+						submissionId: submission.id,
+						publicationId: selectedPublication.id,
+					},
+				},
+			];
+		},
+	},
+
+	metadata: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'metadata',
+						submission,
+						publication: selectedPublication,
+						noFieldsMessage: 'No metadata fields are currently enabled.',
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+
+	citations: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'reference',
+						submission,
+						publication: selectedPublication,
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+	identifiers: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'identifier',
+						submission,
+						publication: selectedPublication,
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+	publicationFormats: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'PublicationFormatManager',
+					props: {
+						submissionId: submission.id,
+						publicationId: selectedPublication.id,
+					},
+				},
+			];
+		},
+	},
+
+	catalogEntry: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'catalogEntry',
+						submission,
+						publication: selectedPublication,
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+
+	license: {
+		getPrimaryItems: ({
+			submission,
+			selectedPublication,
+			pageInitConfig,
+			permissions,
+		}) => {
+			return [
+				{
+					component: 'WorkflowPublicationForm',
+					props: {
+						formName: 'permissionDisclosure',
+						submission,
+						publication: selectedPublication,
+						canEdit: permissions.canEditPublication,
+					},
+				},
+			];
+		},
+	},
+};
diff --git a/src/pages/workflow/composables/useWorkflowDataSubmissionPublication.js b/src/pages/workflow/composables/useWorkflowDataSubmissionPublication.js
new file mode 100644
index 000000000..2415c8920
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowDataSubmissionPublication.js
@@ -0,0 +1,56 @@
+import {useFetch} from '@/composables/useFetch';
+import {useUrl} from '@/composables/useUrl';
+
+import {computed, ref, watch} from 'vue';
+
+export function useWorkflowDataSubmissionPublication({submissionId}) {
+	/**
+	 * Fetch submission details
+	 */
+	const {apiUrl: submissionApiUrl} = useUrl(
+		`submissions/${encodeURIComponent(submissionId)}`,
+	);
+	const {data: submission, fetch: fetchSubmission} = useFetch(submissionApiUrl);
+	fetchSubmission();
+	/** Fetch publications */
+	const selectedPublicationId = ref(null);
+	function selectPublicationId(publicationId) {
+		if (selectedPublicationId.value !== publicationId) {
+			selectedPublicationId.value = publicationId;
+			selectedPublication.value = null;
+			fetchSelectedPublication();
+		}
+	}
+	const selectedPublicationUrlRelative = computed(
+		() =>
+			`submissions/${encodeURIComponent(submissionId)}/publications/${selectedPublicationId.value}`,
+	);
+	const {apiUrl: selectedPublicationUrl} = useUrl(
+		selectedPublicationUrlRelative,
+	);
+	const {data: selectedPublication, fetch: fetchSelectedPublication} = useFetch(
+		selectedPublicationUrl,
+	);
+
+	watch(submission, (newSubmission, oldSubmission) => {
+		// Once the submission is fetched, select relevant stage in navigaton
+		if (!oldSubmission && newSubmission) {
+			selectedPublicationId.value =
+				newSubmission.publications[newSubmission.publications.length - 1].id;
+			fetchSelectedPublication();
+		}
+	});
+
+	async function refetchSubmissionPublication() {
+		return Promise.all([fetchSubmission(), fetchSelectedPublication()]);
+	}
+
+	return {
+		submission,
+		submissionId,
+		selectedPublication,
+		selectedPublicationId,
+		selectPublicationId,
+		refetchSubmissionPublication,
+	};
+}
diff --git a/src/pages/workflow/composables/useWorkflowDecisions.js b/src/pages/workflow/composables/useWorkflowDecisions.js
index 33b41ff00..1230a4032 100644
--- a/src/pages/workflow/composables/useWorkflowDecisions.js
+++ b/src/pages/workflow/composables/useWorkflowDecisions.js
@@ -14,6 +14,23 @@ export const Actions = {
 	DECISION_BACK_FROM_PRODUCTION: 'decisionBackFromProduction',
 	DECISION_RECOMMEND_ACCEPT: 'decisionRecommendAccept',
 	DECISION_RECOMMEND_DECLINE: 'decisionRecommendDecline',
+
+	// OMP SPECIFIC
+	DECISION_INTERNAL_REVIEW: 'decisionInternalReview',
+	DECISION_RECOMMEND_EXTERNAL_REVIEW: 'decisionRecommendExternalReview',
+	DECISION_SKIP_INTERNAL_REVIEW: 'decisionSkipInternalReview',
+	DECISION_ACCEPT_INTERNAL: 'decisionAcceptInternal',
+	DECISION_PENDING_REVISIONS_INTERNAL: 'decisionPendingRevisionsInternal',
+	DECISION_RESUBMIT_INTERNAL: 'decisionResubmitInternal',
+	DECISION_DECLINE_INTERNAL: 'decisionDeclineInternal',
+	DECISION_RECOMMEND_ACCEPT_INTERNAL: 'decisionRecommendAcceptInternal',
+	DECISION_RECOMMEND_PENDING_REVISIONS_INTERNAL:
+		'decisionRecommendPendingRevisionsInternal',
+	DECISION_RECOMMEND_RESUBMIT_INTERNAL: 'decisionRecommendResubmitInternal',
+	DECISION_RECOMMEND_DECLINE_INTERNAL: 'decisionRecommendDeclineInternal',
+	DECISION_REVERT_INTERNAL_DECLINE: 'decisionRevertInternalDecline',
+	DECISION_NEW_INTERNAL_ROUND: 'decisionNewInternalRound',
+	DECISION_CANCEL_INTERNAL_REVIEW_ROUND: 'decisionCancelInternalReviewRound',
 };
 
 function openDecisionPage(submission, decisionId, actionArgs = {}) {
@@ -58,8 +75,10 @@ export function useWorkflowDecisions() {
 		});
 	}
 
-	function decisionExternalReview({submission}) {
-		openDecisionPage(submission, pkp.const.DECISION_EXTERNAL_REVIEW);
+	function decisionExternalReview({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_EXTERNAL_REVIEW, {
+			reviewRoundId,
+		});
 	}
 
 	function decisionSkipExternalReview({submission}) {
@@ -100,6 +119,111 @@ export function useWorkflowDecisions() {
 		});
 	}
 
+	// OMP Specific
+
+	function decisionInternalReview({submission}) {
+		openDecisionPage(submission, pkp.const.DECISION_INTERNAL_REVIEW);
+	}
+
+	function decisionRecommendExternalReview({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_RECOMMEND_EXTERNAL_REVIEW, {
+			reviewRoundId,
+		});
+	}
+
+	function decisionSkipInternalReview({submission}) {
+		openDecisionPage(submission, pkp.const.DECISION_SKIP_INTERNAL_REVIEW);
+	}
+
+	function decisionAcceptInternal({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_ACCEPT_INTERNAL, {
+			reviewRoundId,
+		});
+	}
+
+	function decisionPendingRevisionsInternal({submission, reviewRoundId}) {
+		openDecisionPage(
+			submission,
+			pkp.const.DECISION_PENDING_REVISIONS_INTERNAL,
+			{
+				reviewRoundId,
+			},
+		);
+	}
+
+	function decisionResubmitInternal({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_RESUBMIT_INTERNAL, {
+			reviewRoundId,
+		});
+	}
+
+	function decisionDeclineInternal({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_DECLINE_INTERNAL, {
+			reviewRoundId,
+		});
+	}
+
+	function decisionRecommendAcceptInternal({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_RECOMMEND_ACCEPT_INTERNAL, {
+			reviewRoundId,
+		});
+	}
+
+	function decisionRecommendPendingRevisionsInternal({
+		submission,
+		reviewRoundId,
+	}) {
+		openDecisionPage(
+			submission,
+			pkp.const.DECISION_RECOMMEND_PENDING_REVISIONS_INTERNAL,
+			{
+				reviewRoundId,
+			},
+		);
+	}
+
+	function decisionRecommendResubmitInternal({submission, reviewRoundId}) {
+		openDecisionPage(
+			submission,
+			pkp.const.DECISION_RECOMMEND_RESUBMIT_INTERNAL,
+			{
+				reviewRoundId,
+			},
+		);
+	}
+
+	function decisionRecommendDeclineInternal({submission, reviewRoundId}) {
+		openDecisionPage(
+			submission,
+			pkp.const.DECISION_RECOMMEND_DECLINE_INTERNAL,
+			{
+				reviewRoundId,
+			},
+		);
+	}
+
+	function decisionRevertInternalDecline({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_REVERT_INTERNAL_DECLINE, {
+			reviewRoundId,
+		});
+	}
+
+	function decisionNewInternalRound({submission, reviewRoundId}) {
+		openDecisionPage(submission, pkp.const.DECISION_NEW_INTERNAL_ROUND, {
+			reviewRoundId,
+		});
+	}
+
+	function decisionCancelInternalReviewRound({submission, reviewRoundId}) {
+		openDecisionPage(
+			submission,
+			pkp.const.DECISION_CANCEL_INTERNAL_REVIEW_ROUND,
+			{
+				reviewRoundId,
+			},
+		);
+	}
+
 	return {
 		openDecisionPage,
 		decisionAccept,
@@ -114,5 +238,20 @@ export function useWorkflowDecisions() {
 		decisionBackFromProduction,
 		decisionRecommendAccept,
 		decisionRecommendDecline,
+		// OMP
+		decisionInternalReview,
+		decisionRecommendExternalReview,
+		decisionSkipInternalReview,
+		decisionAcceptInternal,
+		decisionPendingRevisionsInternal,
+		decisionResubmitInternal,
+		decisionDeclineInternal,
+		decisionRecommendAcceptInternal,
+		decisionRecommendPendingRevisionsInternal,
+		decisionRecommendResubmitInternal,
+		decisionRecommendDeclineInternal,
+		decisionRevertInternalDecline,
+		decisionNewInternalRound,
+		decisionCancelInternalReviewRound,
 	};
 }
diff --git a/src/pages/workflow/composables/useWorkflowItems.js b/src/pages/workflow/composables/useWorkflowItems.js
new file mode 100644
index 000000000..017d69468
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowItems.js
@@ -0,0 +1,36 @@
+import {computed} from 'vue';
+
+export function useWorkflowItems(_workflowConfigFns, getArgsFn) {
+	const headerItems = computed(() => {
+		return _workflowConfigFns.getHeaderItems(getArgsFn());
+	});
+
+	const primaryItems = computed(() => {
+		return _workflowConfigFns.getPrimaryItems(getArgsFn());
+	});
+
+	const secondaryItems = computed(() => {
+		return _workflowConfigFns.getSecondaryItems(getArgsFn());
+	});
+
+	const actionItems = computed(() => {
+		return _workflowConfigFns.getActionItems(getArgsFn());
+	});
+
+	const publicationControlsLeft = computed(() => {
+		return _workflowConfigFns.getPublicationControlsLeft(getArgsFn());
+	});
+
+	const publicationControlsRight = computed(() => {
+		return _workflowConfigFns.getPublicationControlsRight(getArgsFn());
+	});
+
+	return {
+		headerItems,
+		primaryItems,
+		secondaryItems,
+		actionItems,
+		publicationControlsLeft,
+		publicationControlsRight,
+	};
+}
diff --git a/src/pages/workflow/composables/useWorkflowMenu.js b/src/pages/workflow/composables/useWorkflowMenu.js
new file mode 100644
index 000000000..0c9bec06f
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowMenu.js
@@ -0,0 +1,56 @@
+import {useSideMenu} from '@/composables/useSideMenu';
+import {computed} from 'vue';
+import {useSubmission} from '@/composables/useSubmission';
+
+const {getReviewRound} = useSubmission();
+
+export function useWorkflowMenu({menuItems, submission}) {
+	const {
+		sideMenuProps,
+		setExpandedKeys,
+		setActiveItemKey,
+		selectedItem: selectedMenuItem,
+	} = useSideMenu(menuItems);
+
+	/**
+	 * primaryMenuItem: workflow/publication/marketing
+	 * secondaryMenuItem: name of publication/marketing submenu
+	 * stageId: applicable when primaryMenuItem is workflow
+	 * reviewRoundId: applicable when reviewRound is selected
+	 */
+	const selectedMenuState = computed(() => {
+		const actionArgs = selectedMenuItem.value?.actionArgs || {};
+
+		return {
+			...actionArgs,
+		};
+	});
+
+	const menuTitle = computed(() => {
+		return selectedMenuState.value?.title || '';
+	});
+
+	const selectedReviewRound = computed(() => {
+		if (!selectedMenuState.value.reviewRoundId) {
+			return null;
+		}
+		const reviewRound = getReviewRound(
+			submission.value,
+			selectedMenuState.value.reviewRoundId,
+		);
+		return reviewRound;
+	});
+
+	function navigateToMenu(key) {
+		setActiveItemKey(key);
+	}
+
+	return {
+		menuTitle,
+		navigateToMenu,
+		selectedMenuState,
+		selectedReviewRound,
+		setExpandedKeys,
+		sideMenuProps,
+	};
+}
diff --git a/src/pages/workflow/composables/useWorkflowNavigationConfig.js b/src/pages/workflow/composables/useWorkflowNavigationConfig.js
deleted file mode 100644
index 681abf0d0..000000000
--- a/src/pages/workflow/composables/useWorkflowNavigationConfig.js
+++ /dev/null
@@ -1,340 +0,0 @@
-import {useSubmission} from '@/composables/useSubmission';
-import {useLocalize} from '@/composables/useLocalize';
-import {DashboardPageTypes} from '@/pages/dashboard/dashboardPageStore';
-export function useWorkflowNavigationConfig(pageInitConfig) {
-	const {publicationSettings} = pageInitConfig;
-	const {t, tk} = useLocalize();
-
-	function getWorkflowTitle(stageId) {
-		const StageTitles = {
-			[pkp.const.WORKFLOW_STAGE_ID_SUBMISSION]: tk(
-				'dashboard.stage.submission',
-			),
-			[pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW]: tk(
-				'dashboard.stage.review',
-			),
-			[pkp.const.WORKFLOW_STAGE_ID_EDITING]: tk('dashboard.stage.copyediting'),
-			[pkp.const.WORKFLOW_STAGE_ID_PRODUCTION]: tk(
-				'dashboard.stage.production',
-			),
-		};
-
-		return `${t('semicolon', {label: t('manager.workflow')})} ${t(StageTitles[stageId])} `;
-	}
-
-	function getPublicationTitle(publicationMenuTitle) {
-		return `${t('semicolon', {label: t('submission.publication')})} ${publicationMenuTitle}`;
-	}
-
-	function getReviewItems(submission) {
-		const {getActiveStage, getCurrentReviewRound} = useSubmission();
-
-		const activeStage = getActiveStage(submission);
-
-		const activeReviewRound = getCurrentReviewRound(
-			submission,
-			pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-		);
-
-		const reviewMenuItems = [];
-
-		const {getReviewRoundsForStage} = useSubmission();
-		const reviewRounds = getReviewRoundsForStage(
-			submission,
-			pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-		);
-
-		reviewRounds.forEach((reviewRound, index) => {
-			reviewMenuItems.push({
-				key: `workflow_${pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW}_${reviewRound.id}`,
-				label: `Review Round ${index + 1}`,
-				colorStripe:
-					(activeStage.id === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW &&
-						activeReviewRound.id) === reviewRound.id
-						? 'border-stage-in-review'
-						: null,
-
-				action: 'selectStage',
-				actionArgs: {
-					reviewRoundId: reviewRound.id,
-					stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-					title: getWorkflowTitle(pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW),
-				},
-			});
-		});
-
-		/*if (submission.stageId === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW) {
-			reviewMenuItems.push({
-				label: 'New Review Round',
-				action: 'decisionNewExternalRound',
-				actionArgs: {
-					reviewRoundId: getCurrentReviewRound(
-						submission,
-						pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-					).id,
-					stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-				},
-			});
-		}*/
-
-		return reviewMenuItems;
-	}
-
-	function getWorkflowItems({submission}) {
-		const {getActiveStage} = useSubmission();
-
-		const activeStage = getActiveStage(submission);
-
-		const externalReviewItems = getReviewItems(submission);
-		return [
-			{
-				key: `workflow_${pkp.const.WORKFLOW_STAGE_ID_SUBMISSION}`,
-				label: 'Submission',
-				colorStripe:
-					activeStage.id === pkp.const.WORKFLOW_STAGE_ID_SUBMISSION
-						? 'border-stage-desk-review'
-						: null,
-				action: 'selectStage',
-				actionArgs: {
-					stageId: pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
-					title: getWorkflowTitle(pkp.const.WORKFLOW_STAGE_ID_SUBMISSION),
-				},
-			},
-			{
-				key: `workflow_${pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW}`,
-				label: 'Review',
-				colorStripe:
-					activeStage.id === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW
-						? 'border-stage-in-review'
-						: null,
-
-				items: externalReviewItems,
-				action: !externalReviewItems.length ? 'selectStage' : undefined,
-				actionArgs: !externalReviewItems.length
-					? {
-							stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-							title: getWorkflowTitle(
-								pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-							),
-						}
-					: undefined,
-			},
-			{
-				key: `workflow_${pkp.const.WORKFLOW_STAGE_ID_EDITING}`,
-				label: 'Copyediting',
-				title: getWorkflowTitle(pkp.const.WORKFLOW_STAGE_ID_EDITING),
-				colorStripe:
-					activeStage.id === pkp.const.WORKFLOW_STAGE_ID_EDITING
-						? 'border-stage-copyediting'
-						: null,
-				action: 'selectStage',
-				actionArgs: {
-					stageId: pkp.const.WORKFLOW_STAGE_ID_EDITING,
-					title: getWorkflowTitle(pkp.const.WORKFLOW_STAGE_ID_EDITING),
-				},
-			},
-			{
-				key: `workflow_${pkp.const.WORKFLOW_STAGE_ID_PRODUCTION}`,
-				label: 'Production',
-				title: getWorkflowTitle(pkp.const.WORKFLOW_STAGE_ID_PRODUCTION),
-				colorStripe:
-					activeStage.id === pkp.const.WORKFLOW_STAGE_ID_PRODUCTION &&
-					submission.status === pkp.const.STATUS_QUEUED
-						? 'border-stage-copyediting'
-						: null,
-				action: 'selectStage',
-				actionArgs: {
-					stageId: pkp.const.WORKFLOW_STAGE_ID_PRODUCTION,
-					title: getWorkflowTitle(pkp.const.WORKFLOW_STAGE_ID_PRODUCTION),
-				},
-			},
-		];
-	}
-
-	function getPublicationItemsAuthor({submission, permissions}) {
-		const items = [];
-
-		items.push({
-			key: 'publication_titleAbstract',
-			label: t('publication.titleAbstract'),
-			action: 'selectPublicationMenu',
-			actionArgs: {
-				publicationMenu: 'titleAbstract',
-				title: getPublicationTitle(t('publication.titleAbstract')),
-			},
-		});
-
-		items.push({
-			key: 'publication_contributors',
-			label: t('publication.contributors'),
-			action: 'selectPublicationMenu',
-			actionArgs: {
-				publicationMenu: 'contributors',
-				title: getPublicationTitle(t('publication.contributors')),
-			},
-		});
-
-		items.push({
-			key: 'publication_metadata',
-			label: t('article.metadata'),
-			action: 'selectPublicationMenu',
-			actionArgs: {
-				publicationMenu: 'metadata',
-				title: getPublicationTitle(t('article.metadata')),
-			},
-		});
-
-		if (publicationSettings.supportsCitations) {
-			items.push({
-				key: 'citations',
-				label: t('submission.citations'),
-				action: 'selectPublicationMenu',
-				actionArgs: {
-					publicationMenu: 'citations',
-					title: getPublicationTitle(t('submission.citations')),
-				},
-			});
-		}
-
-		if (permissions.canAccessProduction) {
-			items.push({
-				key: 'galleys',
-				label: t('submission.layout.galleys'),
-				action: 'selectPublicationMenu',
-				actionArgs: {
-					publicationMenu: 'galleys',
-					title: getPublicationTitle(t('submission.layout.galleys')),
-				},
-			});
-		}
-
-		return items;
-	}
-
-	function getPublicationItemsEditorial({submission, permissions}) {
-		const items = [];
-
-		items.push({
-			key: 'publication_titleAbstract',
-			label: t('publication.titleAbstract'),
-			action: 'selectPublicationMenu',
-			actionArgs: {
-				publicationMenu: 'titleAbstract',
-				title: getPublicationTitle(t('publication.titleAbstract')),
-			},
-		});
-
-		items.push({
-			key: 'publication_contributors',
-			label: t('publication.contributors'),
-			action: 'selectPublicationMenu',
-			actionArgs: {
-				publicationMenu: 'contributors',
-				title: getPublicationTitle(t('publication.contributors')),
-			},
-		});
-
-		items.push({
-			key: 'publication_metadata',
-			label: t('article.metadata'),
-			action: 'selectPublicationMenu',
-			actionArgs: {
-				publicationMenu: 'metadata',
-				title: getPublicationTitle(t('article.metadata')),
-			},
-		});
-
-		if (publicationSettings.supportsCitations) {
-			items.push({
-				key: 'citations',
-				label: t('submission.citations'),
-				action: 'selectPublicationMenu',
-				actionArgs: {
-					publicationMenu: 'citations',
-					title: getPublicationTitle(t('submission.citations')),
-				},
-			});
-		}
-
-		if (publicationSettings.identifiersEnabled) {
-			items.push({
-				key: 'identifiers',
-				label: t('submission.identifiers'),
-				action: 'selectPublicationMenu',
-				actionArgs: {
-					publicationMenu: 'identifiers',
-					title: getPublicationTitle(t('submission.identifiers')),
-				},
-			});
-		}
-
-		items.push({
-			key: 'jats',
-			label: t('publication.jats'),
-			action: 'selectPublicationMenu',
-			actionArgs: {
-				publicationMenu: 'jats',
-				title: getPublicationTitle(t('publication.jats')),
-			},
-		});
-
-		if (permissions.canAccessProduction) {
-			items.push({
-				key: 'galleys',
-				label: t('submission.layout.galleys'),
-				action: 'selectPublicationMenu',
-				actionArgs: {
-					publicationMenu: 'galleys',
-					title: getPublicationTitle(t('submission.layout.galleys')),
-				},
-			});
-
-			items.push({
-				label: t('publication.publicationLicense'),
-				key: 'license',
-				action: 'selectPublicationMenu',
-				actionArgs: {
-					publicationMenu: 'license',
-					title: getPublicationTitle(t('publication.publicationLicense')),
-				},
-			});
-
-			items.push({
-				label: t('issue.issue'),
-				key: 'issue',
-				action: 'selectPublicationMenu',
-				actionArgs: {
-					publicationMenu: 'issue',
-					title: getPublicationTitle(t('issue.issue')),
-				},
-			});
-		}
-
-		return items;
-	}
-
-	function getMenuItems({submission, permissions}) {
-		const menuItems = [
-			{
-				key: 'workflow',
-				label: 'Workflow',
-				icon: 'Dashboard',
-				items: getWorkflowItems({submission, permissions}),
-			},
-			{
-				key: 'publication',
-				label: 'Publication',
-				icon: 'MySubmissions',
-				items:
-					pageInitConfig.dashboardPage ===
-					DashboardPageTypes.EDITORIAL_DASHBOARD
-						? getPublicationItemsEditorial({submission, permissions})
-						: getPublicationItemsAuthor({submission, permissions}),
-			},
-		];
-
-		return menuItems;
-	}
-
-	return {getMenuItems};
-}
diff --git a/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigation.js b/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigation.js
new file mode 100644
index 000000000..a97935880
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigation.js
@@ -0,0 +1,4 @@
+export function useWorkflowNavigation({
+	getMenuItems,
+	getInitialSelectionItemKey,
+}) {}
diff --git a/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOJS.js b/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOJS.js
new file mode 100644
index 000000000..5245b4183
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOJS.js
@@ -0,0 +1,312 @@
+import {useSubmission} from '@/composables/useSubmission';
+import {useLocalize} from '@/composables/useLocalize';
+import {DashboardPageTypes} from '@/pages/dashboard/dashboardPageStore';
+const {getCurrentReviewRound} = useSubmission();
+
+const {t} = useLocalize();
+
+const StageColors = {
+	[pkp.const.WORKFLOW_STAGE_ID_SUBMISSION]: 'border-stage-desk-review',
+	[pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW]: 'border-stage-in-review',
+	[pkp.const.WORKFLOW_STAGE_ID_EDITING]: 'border-stage-copyediting',
+	[pkp.const.WORKFLOW_STAGE_ID_PRODUCTION]: 'border-stage-production',
+};
+
+export function getPublicationItem({label, name}) {
+	return {
+		key: `publication_${name}`,
+		label: label,
+		action: 'selectMenu',
+		actionArgs: {
+			primaryMenuItem: 'publication',
+			secondaryMenuItem: name,
+			title: getPublicationTitle(label),
+		},
+	};
+}
+
+export function getWorkflowItem({stageId, label, isActive, isDisabled, items}) {
+	return {
+		key: `workflow_${stageId}`,
+		label: label,
+		colorStripe: isActive ? StageColors[stageId] : null,
+		action: isDisabled ? undefined : 'selectMenu',
+		actionArgs: {
+			primaryMenuItem: 'workflow',
+			stageId: stageId,
+			title: getWorkflowTitle(label),
+		},
+		items,
+	};
+}
+
+export function getWorkflowTitle(stageLabel) {
+	return `${t('semicolon', {label: t('manager.workflow')})} ${stageLabel} `;
+}
+
+export function getPublicationTitle(publicationMenuTitle) {
+	return `${t('semicolon', {
+		label: t('submission.publication'),
+	})} ${publicationMenuTitle}`;
+}
+
+export function getReviewItems({submission, stageId, title}) {
+	const {getActiveStage, getCurrentReviewRound} = useSubmission();
+
+	const activeStage = getActiveStage(submission);
+
+	const activeReviewRound = getCurrentReviewRound(submission, stageId);
+
+	const reviewMenuItems = [];
+
+	const {getReviewRoundsForStage} = useSubmission();
+	const reviewRounds = getReviewRoundsForStage(submission, stageId);
+
+	reviewRounds.forEach((reviewRound) => {
+		reviewMenuItems.push(
+			getReviewItem({
+				stageId,
+				reviewRound,
+				isActive:
+					activeStage.id === stageId && activeReviewRound.id === reviewRound.id,
+				title: title,
+			}),
+		);
+	});
+
+	return reviewMenuItems;
+}
+
+export function getReviewItem({stageId, reviewRound, isActive, title}) {
+	return {
+		key: `workflow_${stageId}_${reviewRound.id}`,
+		label: t('dashboard.workflow.reviewRoundN', {number: reviewRound.round}),
+		colorStripe: isActive ? StageColors[stageId] : null,
+		action: 'selectMenu',
+		actionArgs: {
+			primaryMenuItem: 'workflow',
+			stageId: stageId,
+			reviewRoundId: reviewRound.id,
+			title: title,
+		},
+	};
+}
+
+export function useWorkflowNavigationConfigOJS(pageInitConfig) {
+	const {publicationSettings} = pageInitConfig;
+	const {t} = useLocalize();
+
+	function getWorkflowItems({submission}) {
+		const {getActiveStage} = useSubmission();
+
+		const activeStage = getActiveStage(submission);
+
+		const externalReviewItems = getReviewItems({
+			submission,
+			stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+			title: t('dashboard.stage.review'),
+		});
+
+		const items = [];
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
+				label: t('dashboard.stage.submission'),
+				isActive: activeStage.id === pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
+			}),
+		);
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+				label: t('dashboard.stage.review'),
+				isActive:
+					activeStage.id === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+				isDisabled: externalReviewItems.length,
+				items: externalReviewItems,
+			}),
+		);
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_EDITING,
+				label: t('dashboard.stage.copyediting'),
+				isActive: activeStage.id === pkp.const.WORKFLOW_STAGE_ID_EDITING,
+			}),
+		);
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_PRODUCTION,
+				label: t('dashboard.stage.production'),
+				isActive: activeStage.id === pkp.const.WORKFLOW_STAGE_ID_PRODUCTION,
+			}),
+		);
+
+		return items;
+	}
+
+	function getPublicationItemsAuthor({submission, permissions}) {
+		const items = [];
+
+		items.push(
+			getPublicationItem({
+				name: 'titleAbstract',
+				label: t('publication.titleAbstract'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'contributors',
+				label: t('publication.contributors'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'metadata',
+				label: t('article.metadata'),
+			}),
+		);
+
+		if (publicationSettings.supportsCitations) {
+			items.push(
+				getPublicationItem({
+					name: 'citations',
+					label: t('submission.citations'),
+				}),
+			);
+		}
+
+		if (permissions.canAccessProduction) {
+			items.push(
+				getPublicationItem({
+					name: 'galleys',
+					label: t('submission.layout.galleys'),
+				}),
+			);
+		}
+
+		return items;
+	}
+
+	function getPublicationItemsEditorial({submission, permissions}) {
+		const items = [];
+
+		items.push(
+			getPublicationItem({
+				name: 'titleAbstract',
+				label: t('publication.titleAbstract'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'contributors',
+				label: t('publication.contributors'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'metadata',
+				label: t('article.metadata'),
+			}),
+		);
+
+		if (publicationSettings.supportsCitations) {
+			items.push(
+				getPublicationItem({
+					name: 'citations',
+					label: t('submission.citations'),
+				}),
+			);
+		}
+
+		if (publicationSettings.identifiersEnabled) {
+			items.push(
+				getPublicationItem({
+					name: 'identifiers',
+					label: t('submission.identifiers'),
+				}),
+			);
+		}
+
+		items.push(
+			getPublicationItem({
+				name: 'jats',
+				label: t('publication.jats'),
+			}),
+		);
+
+		if (permissions.canAccessProduction) {
+			items.push(
+				getPublicationItem({
+					name: 'galleys',
+					label: t('submission.layout.galleys'),
+				}),
+			);
+
+			items.push(
+				getPublicationItem({
+					name: 'license',
+					label: t('publication.publicationLicense'),
+				}),
+			);
+
+			items.push(
+				getPublicationItem({
+					name: 'issue',
+					label: t('issue.issue'),
+				}),
+			);
+		}
+
+		return items;
+	}
+
+	function getMenuItems({submission, permissions}) {
+		const menuItems = [
+			{
+				key: 'workflow',
+				label: t('manager.workflow'),
+				icon: 'Dashboard',
+				items: getWorkflowItems({submission, permissions}),
+			},
+			{
+				key: 'publication',
+				label: t('submission.publication'),
+				icon: 'MySubmissions',
+				items:
+					pageInitConfig.dashboardPage ===
+					DashboardPageTypes.EDITORIAL_DASHBOARD
+						? getPublicationItemsEditorial({submission, permissions})
+						: getPublicationItemsAuthor({submission, permissions}),
+			},
+		];
+
+		return menuItems;
+	}
+
+	function getInitialSelectionItemKey(submission) {
+		if (
+			submission.stageId === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW ||
+			submission.stageId === pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW
+		) {
+			return `workflow_${submission.stageId}_${
+				getCurrentReviewRound(submission, submission.stageId)?.id
+			}`;
+		} else if (
+			submission.stageId === pkp.const.WORKFLOW_STAGE_ID_PRODUCTION &&
+			submission.status !== pkp.const.STATUS_QUEUED
+		) {
+			return `publication_titleAbstract`;
+		} else {
+			return `workflow_${submission.stageId}`;
+		}
+	}
+
+	return {getMenuItems, getInitialSelectionItemKey};
+}
diff --git a/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOMP.js b/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOMP.js
new file mode 100644
index 000000000..899dd6d32
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOMP.js
@@ -0,0 +1,338 @@
+import {useSubmission} from '@/composables/useSubmission';
+import {useLocalize} from '@/composables/useLocalize';
+import {DashboardPageTypes} from '@/pages/dashboard/dashboardPageStore';
+import {
+	getPublicationItem,
+	getWorkflowItem,
+	getReviewItems,
+} from './useWorkflowNavigationConfigOJS';
+
+const {getCurrentReviewRound} = useSubmission();
+
+const {t} = useLocalize();
+
+export function getMarketingTitle(marketingMenuTitle) {
+	return `${t('semicolon', {
+		label: t('settings.libraryFiles.category.marketing'),
+	})} ${marketingMenuTitle}`;
+}
+
+function getMarketingItem({label, name}) {
+	return {
+		key: `marketing_${name}`,
+		label: label,
+		action: 'selectMenu',
+		actionArgs: {
+			primaryMenuItem: 'marketing',
+			secondaryMenuItem: name,
+			title: getMarketingTitle(label),
+		},
+	};
+}
+
+export function useWorkflowNavigationConfigOMP(pageInitConfig) {
+	const {publicationSettings} = pageInitConfig;
+	const {t} = useLocalize();
+
+	function getWorkflowItems({submission}) {
+		const {getActiveStage} = useSubmission();
+
+		const activeStage = getActiveStage(submission);
+
+		const internalReviewItems = getReviewItems({
+			submission,
+			stageId: pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW,
+			title: t('workflow.review.internalReview'),
+		});
+
+		const externalReviewItems = getReviewItems({
+			submission,
+			stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+			title: t('workflow.review.externalReview'),
+		});
+
+		console.log('internal review items:', internalReviewItems);
+		console.log('external review items:', externalReviewItems);
+
+		const items = [];
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
+				label: t('dashboard.stage.submission'),
+				isActive: activeStage.id === pkp.const.WORKFLOW_STAGE_ID_SUBMISSION,
+			}),
+		);
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW,
+				label: t('workflow.review.internalReview'),
+				isActive:
+					activeStage.id === pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW,
+				isDisabled: internalReviewItems.length,
+				items: internalReviewItems,
+			}),
+		);
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+				label: t('workflow.review.externalReview'),
+				isActive:
+					activeStage.id === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
+				isDisabled: externalReviewItems.length,
+				items: externalReviewItems,
+			}),
+		);
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_EDITING,
+				label: t('dashboard.stage.copyediting'),
+				isActive: activeStage.id === pkp.const.WORKFLOW_STAGE_ID_EDITING,
+			}),
+		);
+
+		items.push(
+			getWorkflowItem({
+				stageId: pkp.const.WORKFLOW_STAGE_ID_PRODUCTION,
+				label: t('dashboard.stage.production'),
+				isActive: activeStage.id === pkp.const.WORKFLOW_STAGE_ID_PRODUCTION,
+			}),
+		);
+
+		return items;
+	}
+
+	function getPublicationItemsAuthor({submission, permissions}) {
+		const items = [];
+
+		items.push(
+			getPublicationItem({
+				name: 'titleAbstract',
+				label: t('publication.titleAbstract'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'contributors',
+				label: t('publication.contributors'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'chapters',
+				label: t('submission.chapters'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'metadata',
+				label: t('submission.metadata'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'publicationFormats',
+				label: t('submission.publicationFormats'),
+			}),
+		);
+
+		if (publicationSettings.supportsCitations) {
+			items.push(
+				getPublicationItem({
+					name: 'citations',
+					label: t('submission.citations'),
+				}),
+			);
+		}
+
+		if (permissions.canAccessProduction) {
+			items.push(
+				getPublicationItem({
+					name: 'galleys',
+					label: t('submission.layout.galleys'),
+				}),
+			);
+		}
+
+		return items;
+	}
+
+	function getPublicationItemsEditorial({submission, permissions}) {
+		const items = [];
+
+		items.push(
+			getPublicationItem({
+				name: 'titleAbstract',
+				label: t('publication.titleAbstract'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'contributors',
+				label: t('publication.contributors'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'chapters',
+				label: t('submission.chapters'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'metadata',
+				label: t('submission.metadata'),
+			}),
+		);
+
+		items.push(
+			getPublicationItem({
+				name: 'publicationFormats',
+				label: t('submission.publicationFormats'),
+			}),
+		);
+
+		if (publicationSettings.supportsCitations) {
+			items.push(
+				getPublicationItem({
+					name: 'citations',
+					label: t('submission.citations'),
+				}),
+			);
+		}
+
+		if (publicationSettings.identifiersEnabled) {
+			items.push(
+				getPublicationItem({
+					name: 'identifiers',
+					label: t('submission.identifiers'),
+				}),
+			);
+		}
+
+		items.push(
+			getPublicationItem({
+				name: 'jats',
+				label: t('publication.jats'),
+			}),
+		);
+
+		if (permissions.canAccessProduction) {
+			items.push(
+				getPublicationItem({
+					name: 'galleys',
+					label: t('submission.layout.galleys'),
+				}),
+			);
+
+			items.push(
+				getPublicationItem({
+					name: 'catalogEntry',
+					label: t('publication.catalogEntry'),
+				}),
+			);
+
+			items.push(
+				getPublicationItem({
+					name: 'license',
+					label: t('publication.publicationLicense'),
+				}),
+			);
+		}
+
+		return items;
+	}
+
+	function getMarketingItems({submission, permissions}) {
+		const menuItems = [];
+
+		menuItems.push(
+			getMarketingItem({
+				name: 'audience',
+				label: t('monograph.audience'),
+			}),
+		);
+
+		menuItems.push(
+			getMarketingItem({
+				name: 'representatives',
+				label: t('grid.catalogEntry.representatives'),
+			}),
+		);
+
+		menuItems.push(
+			getMarketingItem({
+				name: 'publicationDates',
+				label: t('grid.catalogEntry.publicationDates'),
+			}),
+		);
+
+		return menuItems;
+	}
+
+	function getMenuItems({submission, permissions}) {
+		if (!submission) {
+			return [];
+		}
+		const menuItems = [];
+
+		menuItems.push({
+			key: 'workflow',
+			label: t('manager.workflow'),
+			icon: 'Dashboard',
+			items: getWorkflowItems({submission, permissions}),
+		});
+
+		if (
+			pageInitConfig.dashboardPage === DashboardPageTypes.EDITORIAL_DASHBOARD
+		) {
+			menuItems.push({
+				key: 'marketing',
+				label: t('settings.libraryFiles.category.marketing'),
+				icon: 'Dashboard',
+				items: getMarketingItems({submission, permissions}),
+			});
+		}
+		menuItems.push({
+			key: 'publication',
+			label: t('submission.publication'),
+			icon: 'MySubmissions',
+			items:
+				pageInitConfig.dashboardPage === DashboardPageTypes.EDITORIAL_DASHBOARD
+					? getPublicationItemsEditorial({submission, permissions})
+					: getPublicationItemsAuthor({submission, permissions}),
+		});
+
+		return menuItems;
+	}
+
+	function getInitialSelectionItemKey(submission) {
+		if (
+			submission.stageId === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW ||
+			submission.stageId === pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW
+		) {
+			return `workflow_${submission.stageId}_${
+				getCurrentReviewRound(submission, submission.stageId)?.id
+			}`;
+		} else if (
+			submission.stageId === pkp.const.WORKFLOW_STAGE_ID_PRODUCTION &&
+			submission.status !== pkp.const.STATUS_QUEUED
+		) {
+			return `publication_titleAbstract`;
+		} else {
+			return `workflow_${submission.stageId}`;
+		}
+	}
+
+	return {getMenuItems, getInitialSelectionItemKey};
+}
diff --git a/src/pages/workflow/composables/useWorkflowPermissions.js b/src/pages/workflow/composables/useWorkflowPermissions.js
new file mode 100644
index 000000000..87517d0a2
--- /dev/null
+++ b/src/pages/workflow/composables/useWorkflowPermissions.js
@@ -0,0 +1,126 @@
+import {computed} from 'vue';
+import {useSubmission} from '@/composables/useSubmission';
+import {EditorialRoles, useCurrentUser} from '@/composables/useCurrentUser';
+
+function hasIntersection(arr1, arr2) {
+	const set = new Set(arr1);
+	return arr2.some((item) => set.has(item));
+}
+
+export function useWorkflowPermissions({submission, selectedPublication}) {
+	const {getActiveStage, getStageById} = useSubmission();
+	const {hasCurrentUserAtLeastOneRole} = useCurrentUser();
+
+	const permissions = computed(() => {
+		// View title, metadata, etc.
+		let canAccessPublication = false;
+		let canEditPublication = false;
+		// Access to galleys and issue entry
+		let canAccessProduction = false;
+		// Ability to publish, unpublish and create versions
+		let canPublish = false;
+		// Access to activity log
+		let canAccessEditorialHistory = false;
+		// Changing submission language
+		let canChangeSubmissionLanguage = false;
+
+		let accessibleStages = [];
+
+		if (!submission.value) {
+			return {
+				canAccessPublication,
+				canAccessProduction,
+				canEditPublication,
+				canPublish,
+				canAccessEditorialHistory,
+				accessibleStages,
+			};
+		}
+
+		const activeStage = getActiveStage(submission.value);
+		const productionStage = getStageById(
+			submission.value,
+			pkp.const.WORKFLOW_STAGE_ID_PRODUCTION,
+		);
+
+		submission.value.stages.forEach((stage) => {
+			if (stage.currentUserAssignedRoles.length) {
+				accessibleStages.push(stage.id);
+			}
+		});
+
+		// TODO this will be replaced by with one flag from backend
+		productionStage.stageAssignments
+			.filter(
+				(stageAssignment) => stageAssignment.userId === pkp.currentUser.id,
+			)
+			.forEach((stageAssignment) => {
+				if (stageAssignment.canChangeMetadata) {
+					canEditPublication = true;
+				}
+			});
+		if (hasCurrentUserAtLeastOneRole([pkp.const.ROLE_ID_MANAGER])) {
+			canEditPublication = true;
+		}
+
+		if (
+			selectedPublication.value &&
+			selectedPublication.value?.status === pkp.const.STATUS_PUBLISHED
+		) {
+			canEditPublication = false;
+		}
+
+		if (
+			hasIntersection(activeStage.currentUserAssignedRoles, [
+				...EditorialRoles,
+				pkp.const.ROLE_ID_AUTHOR,
+			])
+		) {
+			canAccessPublication = true;
+
+			if (
+				hasIntersection(productionStage.currentUserAssignedRoles, [
+					...EditorialRoles,
+					pkp.const.ROLE_ID_AUTHOR,
+				])
+			) {
+				canAccessProduction = true;
+			}
+			if (
+				!productionStage.currentUserCanRecommendOnly &&
+				hasIntersection(productionStage.currentUserAssignedRoles, [
+					pkp.const.ROLE_ID_SITE_ADMIN,
+					pkp.const.ROLE_ID_MANAGER,
+				])
+			) {
+				canPublish = true;
+			}
+		}
+
+		if (
+			hasIntersection(activeStage.currentUserAssignedRoles, [
+				pkp.const.ROLE_ID_MANAGER,
+				pkp.const.ROLE_ID_SITE_ADMIN,
+				pkp.const.ROLE_ID_SUB_EDITOR,
+			])
+		) {
+			canAccessEditorialHistory = true;
+		}
+
+		if (canPublish || canEditPublication) {
+			canChangeSubmissionLanguage = true;
+		}
+
+		return {
+			canAccessPublication,
+			canAccessProduction,
+			canEditPublication,
+			canPublish,
+			canAccessEditorialHistory,
+			canChangeSubmissionLanguage,
+			accessibleStages,
+		};
+	});
+
+	return {permissions};
+}
diff --git a/src/pages/workflow/workflowStore.js b/src/pages/workflow/workflowStore.js
index bdcde0e68..84516b55d 100644
--- a/src/pages/workflow/workflowStore.js
+++ b/src/pages/workflow/workflowStore.js
@@ -1,411 +1,4 @@
-import {computed, ref, watch} from 'vue';
-
-import {defineComponentStore} from '@/utils/defineComponentStore';
-import {useFetch} from '@/composables/useFetch';
-import {useUrl} from '@/composables/useUrl';
-import {EditorialRoles, useCurrentUser} from '@/composables/useCurrentUser';
-import {
-	useWorkflowActions,
-	Actions as WorkflowActions,
-} from './composables/useWorkflowActions';
-
-import {
-	useWorkflowDecisions,
-	Actions as DecisionActions,
-} from './composables/useWorkflowDecisions';
-
-import {DashboardPageTypes} from '../dashboard/dashboardPageStore';
-
-import {useWorkflowEditorialConfig} from './composables/useWorkflowEditorialConfig';
-import {useWorkflowAuthorConfig} from './composables/useWorkflowAuthorConfig';
-
-import {useDataChangedProvider} from '@/composables/useDataChangedProvider';
-import {useWorkflowNavigationConfig} from './composables/useWorkflowNavigationConfig';
-import {useSubmission} from '@/composables/useSubmission';
-import {useSideMenu} from '@/composables/useSideMenu';
-
-export const useWorkflowStore = defineComponentStore('workflow', (props) => {
-	const dashboardPage = props.pageInitConfig.dashboardPage;
-
-	const {getReviewRound, getCurrentReviewRound} = useSubmission();
-
-	/**
-	 * Fetch submission details
-	 */
-	const {apiUrl: submissionApiUrl} = useUrl(
-		`submissions/${encodeURIComponent(props.submissionId)}`,
-	);
-	const {data: submission, fetch: fetchSubmission} = useFetch(submissionApiUrl);
-
-	/** Fetch publications */
-	const selectedPublicationId = ref(null);
-	function selectPublicationId(publicationId) {
-		if (selectedPublicationId.value !== publicationId) {
-			selectedPublicationId.value = publicationId;
-			selectedPublication.value = null;
-			fetchSelectedPublication();
-		}
-	}
-	const selectedPublicationUrlRelative = computed(
-		() =>
-			`submissions/${encodeURIComponent(props.submissionId)}/publications/${selectedPublicationId.value}`,
-	);
-	const {apiUrl: selectedPublicationUrl} = useUrl(
-		selectedPublicationUrlRelative,
-	);
-	const {data: selectedPublication, fetch: fetchSelectedPublication} = useFetch(
-		selectedPublicationUrl,
-	);
-
-	/**
-	 * Data changes tracking
-	 */
-	const {triggerDataChange} = useDataChangedProvider(() => {
-		return Promise.all([fetchSubmission(), fetchSelectedPublication()]);
-	});
-
-	/** Current publication is fetched always when the new submission is fetched */
-	watch(submission, (newSubmission, oldSubmission) => {
-		// Once the submission is fetched, select relevant stage in navigaton
-		if (!oldSubmission && newSubmission) {
-			selectedPublicationId.value =
-				newSubmission.publications[newSubmission.publications.length - 1].id;
-			fetchSelectedPublication();
-
-			if (
-				newSubmission.stageId === pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW
-			) {
-				setActiveItemKey(
-					`workflow_${newSubmission.stageId}_${
-						getCurrentReviewRound(
-							newSubmission,
-							pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW,
-						)?.id
-					}`,
-				);
-			} else if (
-				newSubmission.stageId === pkp.const.WORKFLOW_STAGE_ID_PRODUCTION &&
-				newSubmission.status !== pkp.const.STATUS_QUEUED
-			) {
-				setActiveItemKey(`publication_titleAbstract`);
-			} else {
-				setActiveItemKey(`workflow_${newSubmission.stageId}`);
-			}
-		}
-	});
-
-	fetchSubmission();
-
-	/**
-	 * UI Permissions
-	 */
-
-	const {getActiveStage, getStageById} = useSubmission();
-	const {hasCurrentUserAtLeastOneRole} = useCurrentUser();
-
-	function hasIntersection(arr1, arr2) {
-		const set = new Set(arr1);
-		return arr2.some((item) => set.has(item));
-	}
-
-	const permissions = computed(() => {
-		// View title, metadata, etc.
-		let canAccessPublication = false;
-		let canEditPublication = false;
-		// Access to galleys and issue entry
-		let canAccessProduction = false;
-		// Ability to publish, unpublish and create versions
-		let canPublish = false;
-		// Access to activity log
-		let canAccessEditorialHistory = false;
-		// Changing submission language
-		let canChangeSubmissionLanguage = false;
-
-		let accessibleStages = [];
-
-		if (!submission.value) {
-			return {
-				canAccessPublication,
-				canAccessProduction,
-				canEditPublication,
-				canPublish,
-				canAccessEditorialHistory,
-				accessibleStages,
-			};
-		}
-
-		const activeStage = getActiveStage(submission.value);
-		const productionStage = getStageById(
-			submission.value,
-			pkp.const.WORKFLOW_STAGE_ID_PRODUCTION,
-		);
-
-		submission.value.stages.forEach((stage) => {
-			if (stage.currentUserAssignedRoles.length) {
-				accessibleStages.push(stage.id);
-			}
-		});
-
-		// TODO this will be replaced by with one flag from backend
-		productionStage.stageAssignments
-			.filter(
-				(stageAssignment) => stageAssignment.userId === pkp.currentUser.id,
-			)
-			.forEach((stageAssignment) => {
-				if (stageAssignment.canChangeMetadata) {
-					canEditPublication = true;
-				}
-			});
-		if (hasCurrentUserAtLeastOneRole([pkp.const.ROLE_ID_MANAGER])) {
-			canEditPublication = true;
-		}
-
-		if (
-			selectedPublication.value &&
-			selectedPublication.value?.status === pkp.const.STATUS_PUBLISHED
-		) {
-			canEditPublication = false;
-		}
-
-		if (
-			hasIntersection(activeStage.currentUserAssignedRoles, [
-				...EditorialRoles,
-				pkp.const.ROLE_ID_AUTHOR,
-			])
-		) {
-			canAccessPublication = true;
-
-			if (
-				hasIntersection(productionStage.currentUserAssignedRoles, [
-					...EditorialRoles,
-					pkp.const.ROLE_ID_AUTHOR,
-				])
-			) {
-				canAccessProduction = true;
-			}
-			if (
-				!productionStage.currentUserCanRecommendOnly &&
-				hasIntersection(productionStage.currentUserAssignedRoles, [
-					pkp.const.ROLE_ID_SITE_ADMIN,
-					pkp.const.ROLE_ID_MANAGER,
-				])
-			) {
-				canPublish = true;
-			}
-		}
-
-		if (
-			hasIntersection(activeStage.currentUserAssignedRoles, [
-				pkp.const.ROLE_ID_MANAGER,
-				pkp.const.ROLE_ID_SITE_ADMIN,
-				pkp.const.ROLE_ID_SUB_EDITOR,
-			])
-		) {
-			canAccessEditorialHistory = true;
-		}
-
-		if (canPublish || canEditPublication) {
-			canChangeSubmissionLanguage = true;
-		}
-
-		return {
-			canAccessPublication,
-			canAccessProduction,
-			canEditPublication,
-			canPublish,
-			canAccessEditorialHistory,
-			canChangeSubmissionLanguage,
-			accessibleStages,
-		};
-	});
-
-	/**
-	 * Handling navigation
-	 */
-	const {getMenuItems} = useWorkflowNavigationConfig(props.pageInitConfig);
-	const menuItems = computed(() => {
-		if (!submission.value) {
-			return [];
-		}
-
-		return getMenuItems({
-			submission: submission.value,
-			permissions: permissions.value,
-		});
-	});
-
-	function navigateToMenu({key}) {
-		setActiveItemKey(key);
-		return;
-	}
-
-	const {
-		sideMenuProps,
-		setActiveItemKey,
-		selectedItem: selectedMenuItem,
-	} = useSideMenu(menuItems, {
-		expandedKeys: {
-			workflow: true,
-			publication: true,
-		},
-	});
-
-	const selectedMenuState = computed(() => {
-		return selectedMenuItem.value?.actionArgs || {};
-	});
-
-	const selectedReviewRound = computed(() => {
-		if (!selectedMenuState.value.reviewRoundId) {
-			return null;
-		}
-		const reviewRound = getReviewRound(
-			submission.value,
-			selectedMenuState.value.reviewRoundId,
-		);
-		return reviewRound;
-	});
-
-	/**
-	 * Expose workflow actions
-	 *
-	 */
-	const _workflowActionsFns = useWorkflowActions(props.pageInitConfig);
-	const workflowActions = Object.values(WorkflowActions).reduce(
-		(acc, actionName) => {
-			acc[actionName] = (noArgs, finishedCallback = null) =>
-				_workflowActionsFns[actionName](
-					{
-						submission: submission.value,
-						selectedPublication: selectedPublication.value,
-						reviewRoundId: selectedReviewRound.value?.id,
-						store,
-					},
-					(finishedData) => {
-						triggerDataChange();
-						if (finishedCallback) {
-							finishedCallback(finishedData);
-						}
-					},
-				);
-			return acc;
-		},
-		{},
-	);
-
-	/**
-	 * Expose decision functions
-	 *
-	 * */
-	const _workflowDecisionsFns = useWorkflowDecisions();
-	const decisionActions = Object.values(DecisionActions).reduce(
-		(acc, actionName) => {
-			acc[actionName] = (noArgs) =>
-				_workflowDecisionsFns[actionName]({
-					submission: submission.value,
-					selectedPublication: selectedPublication.value,
-					reviewRoundId: selectedReviewRound.value?.id,
-				});
-			return acc;
-		},
-		{},
-	);
-
-	/**
-	 * Items
-	 *
-	 * */
-
-	const _workflowEditorialConfigFns =
-		dashboardPage === DashboardPageTypes.EDITORIAL_DASHBOARD
-			? useWorkflowEditorialConfig()
-			: useWorkflowAuthorConfig();
-
-	const stageTitle = computed(() => {
-		return selectedMenuState.value?.title || '';
-	});
-
-	function _getItemsArgs() {
-		return {
-			selectedMenuState: selectedMenuState.value,
-			submission: submission.value,
-			pageInitConfig: props.pageInitConfig,
-			selectedPublication: selectedPublication.value,
-			selectedPublicationId: selectedPublicationId.value,
-			selectedReviewRound: selectedReviewRound.value,
-			permissions: permissions.value,
-		};
-	}
-
-	/** Header Actions */
-	const headerItems = computed(() => {
-		return _workflowEditorialConfigFns.getHeaderItems({
-			submission: submission.value,
-			selectedPublication: selectedPublication.value,
-			publicationSettings: props.pageInitConfig.publicationSettings,
-			permissions: permissions.value,
-		});
-	});
-
-	const primaryItems = computed(() => {
-		return _workflowEditorialConfigFns.getPrimaryItems(_getItemsArgs());
-	});
-
-	const secondaryItems = computed(() => {
-		return _workflowEditorialConfigFns.getSecondaryItems(_getItemsArgs());
-	});
-
-	const actionItems = computed(() => {
-		return _workflowEditorialConfigFns.getActionItems(_getItemsArgs());
-	});
-
-	const publicationControlsLeft = computed(() => {
-		return _workflowEditorialConfigFns.getPublicationControlsLeft(
-			_getItemsArgs(),
-		);
-	});
-
-	const publicationControlsRight = computed(() => {
-		return _workflowEditorialConfigFns.getPublicationControlsRight(
-			_getItemsArgs(),
-		);
-	});
-
-	const store = {
-		dashboardPage,
-		submission,
-		selectedPublication,
-		selectPublicationId,
-
-		/**
-		 * Navigation
-		 * */
-		selectedMenuItem,
-		sideMenuProps,
-		selectedMenuState,
-		navigateToMenu,
-
-		/** Actions
-		 *
-		 */
-		...workflowActions,
-		...decisionActions,
-
-		/**
-		 * Summary
-		 */
-		stageTitle,
-		headerItems,
-		primaryItems,
-		secondaryItems,
-		actionItems,
-		publicationControlsLeft,
-		publicationControlsRight,
-
-		/**
-		 * Expose for extensions
-		 */
-
-		_workflowActionsFns,
-	};
-	return store;
-});
+import {getComponentStoreByName} from '@/utils/defineComponentStore';
+export function useWorkflowStore() {
+	return getComponentStoreByName('workflow');
+}
diff --git a/src/pages/workflow/workflowStoreOMP.js b/src/pages/workflow/workflowStoreOMP.js
new file mode 100644
index 000000000..63f356459
--- /dev/null
+++ b/src/pages/workflow/workflowStoreOMP.js
@@ -0,0 +1,275 @@
+import {computed, watch, markRaw} from 'vue';
+
+import {defineComponentStore} from '@/utils/defineComponentStore';
+import {
+	useWorkflowActions,
+	Actions as WorkflowActions,
+} from './composables/useWorkflowActions';
+
+import {
+	useWorkflowDecisions,
+	Actions as DecisionActions,
+} from './composables/useWorkflowDecisions';
+
+import {useDataChangedProvider} from '@/composables/useDataChangedProvider';
+
+import {wrapActionFns} from '@/utils/wrapActionFns';
+
+// #else
+import {useWorkflowConfigOMP as useWorkflowConfig} from './composables/useWorkflowConfig/useWorkflowConfigOMP';
+import {useWorkflowNavigationConfigOMP as useWorkflowNavigationConfig} from './composables/useWorkflowNavigationConfig/useWorkflowNavigationConfigOMP';
+
+import {useWorkflowDataSubmissionPublication} from './composables/useWorkflowDataSubmissionPublication';
+import {useWorkflowPermissions} from './composables/useWorkflowPermissions';
+import {useWorkflowMenu} from './composables/useWorkflowMenu';
+import {useWorkflowItems} from './composables/useWorkflowItems';
+import {useSubmission} from '@/composables/useSubmission';
+
+import FileManager from '@/managers/FileManager/FileManager.vue';
+import ReviewerManager from '@/managers/ReviewerManager/ReviewerManager.vue';
+import DiscussionManager from '@/managers/DiscussionManager/DiscussionManager.vue';
+import ContributorManager from '@/managers/ContributorManager/ContributorManager.vue';
+import ParticipantManager from '@/managers/ParticipantManager/ParticipantManager.vue';
+import GalleyManager from '@/managers/GalleyManager/GalleyManager.vue';
+import ChapterManager from '@/managers/ChapterManager/ChapterManager.vue';
+import PublicationFormatManager from '@/managers/PublicationFormatManager/PublicationFormatManager.vue';
+import RepresentativeManager from '@/managers/RepresentativeManager/RepresentativeManager.vue';
+import WorkflowMarketingForm from './components/publication/WorkflowMarketingForm.vue';
+import WorkflowWorkTypeOMP from './components/header/WorkflowWorkTypeOMP.vue';
+import WorkflowActionButton from './components/action/WorkflowActionButton.vue';
+import WorkflowRecommendOnlyControls from './components/action/WorkflowRecommendOnlyControls.vue';
+import WorkflowRecommendOnlyListingRecommendations from './components/secondary/WorkflowRecommendOnlyListingRecommendations.vue';
+import WorkflowNotificationDisplay from './components/primary/WorkflowNotificationDisplay.vue';
+import WorkflowPaymentDropdown from './components/header/WorkflowPaymentDropdown.vue';
+import WorkflowPublicationForm from './components/publication/WorkflowPublicationForm.vue';
+import WorkflowPublicationJats from './components/publication/WorkflowPublicationJats.vue';
+import WorkflowPublicationVersionControl from './components/publication/WorkflowPublicationVersionControl.vue';
+import WorkflowChangeSubmissionLanguage from './components/publication/WorkflowChangeSubmissionLanguage.vue';
+import WorkflowPrimaryBasicMetadata from './components/primary/WorkflowPrimaryBasicMetadata.vue';
+import WorkflowReviewRoundStatus from './components/primary/WorkflowReviewRoundStatus.vue';
+import WorkflowSubmissionStatus from './components/primary/WorkflowSubmissionStatus.vue';
+import WorkflowPublicationEditDisabled from './components/publication/WorkflowPublicationEditDisabled.vue';
+
+export const useWorkflowStore = defineComponentStore('workflow', (props) => {
+	const dashboardPage = props.pageInitConfig.dashboardPage;
+
+	/**
+	 * Submission & Publication
+	 */
+	const {
+		submission,
+		submissionId,
+		selectPublicationId,
+		selectedPublication,
+		selectedPublicationId,
+		refetchSubmissionPublication,
+	} = useWorkflowDataSubmissionPublication({submissionId: props.submissionId});
+
+	const {getExtendedStage, getExtendedStageLabel} = useSubmission();
+
+	/**
+	 * Current Stage Indication
+	 */
+	const extendedStage = computed(
+		() => submission.value && getExtendedStage(submission.value),
+	);
+	const stageLabel = computed(
+		() => submission.value && getExtendedStageLabel(submission.value),
+	);
+
+	/**
+	 * Data changes tracking
+	 */
+	const {triggerDataChange} = useDataChangedProvider(() => {
+		return refetchSubmissionPublication();
+	});
+
+	/**
+	 * UI Permissions
+	 */
+	const {permissions} = useWorkflowPermissions({
+		submission,
+		selectedPublication,
+	});
+
+	/**
+	 * Navigation
+	 */
+
+	const {getMenuItems, getInitialSelectionItemKey} =
+		useWorkflowNavigationConfig(props.pageInitConfig);
+
+	const menuItems = computed(() =>
+		getMenuItems({
+			submission: submission.value,
+			permissions: permissions.value,
+		}),
+	);
+
+	const {
+		menuTitle,
+		navigateToMenu,
+		selectedMenuState,
+		selectedReviewRound,
+		setExpandedKeys,
+		sideMenuProps,
+	} = useWorkflowMenu({menuItems, submission});
+
+	setExpandedKeys([
+		'workflow',
+		'publication',
+		'marketing',
+		`workflow_${pkp.const.WORKFLOW_STAGE_ID_EXTERNAL_REVIEW}`,
+		`workflow_${pkp.const.WORKFLOW_STAGE_ID_INTERNAL_REVIEW}`,
+	]);
+
+	/** When submission is loaded initially - select relevant menu */
+	watch(submission, (newSubmission, oldSubmission) => {
+		// Once the submission is fetched, select relevant stage in navigaton
+		if (!oldSubmission && newSubmission) {
+			console.log(
+				'navigate to menu:',
+				getInitialSelectionItemKey(newSubmission),
+			);
+			navigateToMenu(getInitialSelectionItemKey(newSubmission));
+		}
+	});
+
+	/**
+	 * Expose workflow actions
+	 *
+	 */
+	const _workflowActionsFns = useWorkflowActions(props.pageInitConfig);
+	const workflowActions = wrapActionFns(
+		WorkflowActions,
+		_workflowActionsFns,
+		(actionFn, actionArgs, finishedCallback = null) =>
+			actionFn(
+				{
+					...actionArgs,
+					submission: submission.value,
+					selectedPublication: selectedPublication.value,
+					reviewRoundId: selectedReviewRound.value?.id,
+					store,
+				},
+				(finishedData) => {
+					triggerDataChange();
+					if (finishedCallback) {
+						finishedCallback(finishedData);
+					}
+				},
+			),
+	);
+
+	/**
+	 * Expose decision functions
+	 *
+	 * */
+	const _workflowDecisionsFns = useWorkflowDecisions();
+	const decisionActions = wrapActionFns(
+		DecisionActions,
+		_workflowDecisionsFns,
+		(actionFn, actionArgs) =>
+			actionFn({
+				...actionArgs,
+				submission: submission.value,
+				selectedPublication: selectedPublication.value,
+				reviewRoundId: selectedReviewRound.value?.id,
+			}),
+	);
+
+	/**
+	 * Items
+	 *
+	 * */
+
+	const _workflowConfigFns = useWorkflowConfig({dashboardPage});
+
+	const {
+		headerItems,
+		primaryItems,
+		secondaryItems,
+		actionItems,
+		publicationControlsLeft,
+		publicationControlsRight,
+	} = useWorkflowItems(_workflowConfigFns, () => ({
+		selectedMenuState: selectedMenuState.value,
+		submission: submission.value,
+		pageInitConfig: props.pageInitConfig,
+		selectedPublication: selectedPublication.value,
+		selectedPublicationId: selectedPublicationId.value,
+		selectedReviewRound: selectedReviewRound.value,
+		permissions: permissions.value,
+	}));
+
+	const Components = markRaw({
+		FileManager,
+		ReviewerManager,
+		DiscussionManager,
+		ContributorManager,
+		ParticipantManager,
+		GalleyManager,
+		ChapterManager,
+		RepresentativeManager,
+		PublicationFormatManager,
+		WorkflowActionButton,
+		WorkflowRecommendOnlyControls,
+		WorkflowRecommendOnlyListingRecommendations,
+		WorkflowNotificationDisplay,
+		WorkflowPaymentDropdown,
+		WorkflowPrimaryBasicMetadata,
+		WorkflowReviewRoundStatus,
+		WorkflowPublicationForm,
+		WorkflowPublicationJats,
+		WorkflowPublicationVersionControl,
+		WorkflowChangeSubmissionLanguage,
+		WorkflowSubmissionStatus,
+		WorkflowPublicationEditDisabled,
+		WorkflowMarketingForm,
+		WorkflowWorkTypeOMP,
+	});
+
+	const store = {
+		dashboardPage,
+		submission,
+		submissionId,
+		selectedPublication,
+		selectPublicationId,
+		extendedStage,
+		stageLabel,
+
+		/**
+		 * Navigation
+		 * */
+		sideMenuProps,
+		selectedMenuState,
+		navigateToMenu,
+
+		/** Actions
+		 *
+		 */
+		...workflowActions,
+		...decisionActions,
+
+		/**
+		 * Summary
+		 */
+		menuTitle,
+		headerItems,
+		primaryItems,
+		secondaryItems,
+		actionItems,
+		publicationControlsLeft,
+		publicationControlsRight,
+
+		/**
+		 * Expose for extensions
+		 */
+
+		_workflowActionsFns,
+		_workflowDecisionsFns,
+
+		Components,
+	};
+	return store;
+});
diff --git a/src/utils/defineComponentStore.js b/src/utils/defineComponentStore.js
index eb2c82a0d..35ccd9b4d 100644
--- a/src/utils/defineComponentStore.js
+++ b/src/utils/defineComponentStore.js
@@ -1,13 +1,17 @@
 import {defineStore, getActivePinia} from 'pinia';
 import {onMounted, onBeforeUnmount, provide, inject} from 'vue';
 
+let storesMap = {};
+
+export function getComponentStoreByName(storeName) {
+	return storesMap[storeName].useStore();
+}
+
 export function defineComponentStore(
 	_storeName,
 	setupFn,
 	{requireNamespace} = {},
 ) {
-	let storesMap = {};
-
 	return function (initConfig, _namespace = '') {
 		if (!_namespace && requireNamespace) {
 			const injectedNamespace = inject(_storeName)?.namespace;
diff --git a/src/utils/wrapActionFns.js b/src/utils/wrapActionFns.js
new file mode 100644
index 000000000..37c7d3d4f
--- /dev/null
+++ b/src/utils/wrapActionFns.js
@@ -0,0 +1,8 @@
+export function wrapActionFns(Actions, ActionsFns, wrapperFn) {
+	return Object.values(Actions).reduce((acc, actionName) => {
+		acc[actionName] = (actionArgs, finishedCallback) =>
+			wrapperFn(ActionsFns[actionName], actionArgs, finishedCallback);
+
+		return acc;
+	}, {});
+}