add user invitation story

Author: ipula

public/globals.js

@@ -268,6 +268,12 @@ window.pkp = {
 		'submission.submit.newSubmissionSingle': 'New Submission',
 		'submissions.incomplete': 'Incomplete',
 		'validator.required': 'This field is required.',
+		'invitation.notification.title': 'Invitation sent',
+		'invitation.wizard.success': "{$email} has been invited to a new role in OJS. You can be updated about the user's decision on the User & Role page, your OJS notification and/or your email",
+		'user.email': 'Email',
+		'user.username': 'Username',
+		'user.orcid': 'ORCID iD',
+		'invitation.notification.closeBtn':'View all users'
 	},
 	tinyMCE: {
 		skinUrl: '/styles/tinymce',

src/components/Container/PageOJS.vue

@@ -1,10 +1,12 @@
 <script>
 import Page from '@/components/Container/Page.vue';
 import SubmissionsPage from '@/pages/submissions/SubmissionsPage.vue';
+import UserInvitationPage from '@/pages/userInvitation/UserInvitationPage.vue';
 
 export default {
 	components: {
 		SubmissionsPage,
+		UserInvitationPage,
 	},
 	extends: Page,
 };

src/pages/userInvitation/UserInvitationPage.mdx

@@ -0,0 +1,9 @@
+import {Primary, Controls, Stories, Meta, ArgTypes} from '@storybook/blocks';
+
+import * as UserInvitationPage from './UserInvitationPage.stories.js';
+
+<Meta of={UserInvitationPage} />
+
+# User Invitation page
+
+<ArgTypes />

src/pages/userInvitation/UserInvitationPage.stories.js

@@ -0,0 +1,32 @@
+import UserInvitationPage from './UserInvitationPage.vue';
+import {http, HttpResponse} from 'msw';
+import userMock from './mocks/userMock.js';
+import PageInitConfigMock from './mocks/pageInitConfig';
+
+export default {title: 'Pages/UserInvitation', component: UserInvitationPage};
+
+export const init = {
+	render: (args) => ({
+		components: {UserInvitationPage},
+		setup() {
+			return {args};
+		},
+		template: '<UserInvitationPage v-bind="args" />',
+	}),
+	parameters: {
+		msw: {
+			handlers: [
+				http.get('https://mock/index.php/publicknowledge/api/v1/_user', () => {
+					return HttpResponse.json(userMock);
+				}),
+				http.post(
+					'https://mock/index.php/publicknowledge/api/v1/user/_invite',
+					() => {
+						return HttpResponse.json('invitation send successfully');
+					},
+				),
+			],
+		},
+	},
+	args: PageInitConfigMock,
+};