add prettier

pages/subscriptions/[subscriptionId].tsx

-import React from 'react';
-
 import { WfoSubscriptionDetailPage } from '@orchestrator-ui/orchestrator-ui-components';
+import React from 'react';
 
 const SubscriptionDetailPage = () => <WfoSubscriptionDetailPage />;
 

pages/subscriptions/index.tsx

-import React from 'react';
-
 import {
-    PolicyResource,
-    WfoPolicyRenderPageFallback,
-    WfoSubscriptionsListPage,
+  PolicyResource,
+  WfoPolicyRenderPageFallback,
+  WfoSubscriptionsListPage,
 } from '@orchestrator-ui/orchestrator-ui-components';
+import React from 'react';
 
 export default function SubscriptionsPage() {
-    return (
-        <WfoPolicyRenderPageFallback
-            resource={PolicyResource.NAVIGATION_SUBSCRIPTIONS}
-        >
-            <WfoSubscriptionsListPage />
-        </WfoPolicyRenderPageFallback>
-    );
+  return (
+    <WfoPolicyRenderPageFallback
+      resource={PolicyResource.NAVIGATION_SUBSCRIPTIONS}
+    >
+      <WfoSubscriptionsListPage />
+    </WfoPolicyRenderPageFallback>
+  );
 }

pages/tasks/[taskId].tsx

-import React from 'react';
-
-import { useRouter } from 'next/router';
-
 import { WfoProcessDetailPage } from '@orchestrator-ui/orchestrator-ui-components';
+import { useRouter } from 'next/router';
+import React from 'react';
 
 const TaskDetailPage = () => {
-    const router = useRouter();
-    const { taskId } = router.query;
+  const router = useRouter();
+  const { taskId } = router.query;
 
-    return (
-        <>
-            {(taskId && typeof taskId === 'string' && (
-                <WfoProcessDetailPage processId={taskId} />
-            )) || <div>Invalid taskId</div>}
-        </>
-    );
+  return (
+    <>
+      {(taskId && typeof taskId === 'string' && (
+        <WfoProcessDetailPage processId={taskId} />
+      )) || <div>Invalid taskId</div>}
+    </>
+  );
 };
 
 export default TaskDetailPage;

pages/tasks/index.tsx

-import React from 'react';
-
 import {
-    PolicyResource,
-    WfoPolicyRenderPageFallback,
-    WfoTasksListPage,
+  PolicyResource,
+  WfoPolicyRenderPageFallback,
+  WfoTasksListPage,
 } from '@orchestrator-ui/orchestrator-ui-components';
+import React from 'react';
 
 export function TasksPage() {
-    return (
-        <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_TASKS}>
-            <WfoTasksListPage />
-        </WfoPolicyRenderPageFallback>
-    );
+  return (
+    <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_TASKS}>
+      <WfoTasksListPage />
+    </WfoPolicyRenderPageFallback>
+  );
 }
 
 export default TasksPage;

pages/tasks/new/[taskName].tsx

-import React from 'react';
-
-import { useRouter } from 'next/router';
-
 import { WfoStartProcessPage } from '@orchestrator-ui/orchestrator-ui-components';
+import { useRouter } from 'next/router';
+import React from 'react';
 
 const StartTaskPage = () => {
-    const router = useRouter();
-    const { taskName } = router.query;
+  const router = useRouter();
+  const { taskName } = router.query;
 
-    if (taskName && typeof taskName === 'string') {
-        return <WfoStartProcessPage isTask={true} processName={taskName} />;
-    }
+  if (taskName && typeof taskName === 'string') {
+    return <WfoStartProcessPage isTask={true} processName={taskName} />;
+  }
 
-    return <div>Invalid arguments provided</div>;
+  return <div>Invalid arguments provided</div>;
 };
 
 export default StartTaskPage;

pages/tasks/new/index.tsx

-import { useEffect } from 'react';
-
-import { useRouter } from 'next/router';
-
 import { PATH_TASKS } from '@orchestrator-ui/orchestrator-ui-components';
+import { useRouter } from 'next/router';
+import { useEffect } from 'react';
 
 const IndexPage = () => {
-    const router = useRouter();
+  const router = useRouter();
 
-    useEffect(() => {
-        router.push(PATH_TASKS);
-    }, [router]);
+  useEffect(() => {
+    router.push(PATH_TASKS);
+  }, [router]);
 
-    return null;
+  return null;
 };
 
 export default IndexPage;

pages/workflows/[workflowId].tsx

-import React from 'react';
-
-import { useRouter } from 'next/router';
-
 import { WfoProcessDetailPage } from '@orchestrator-ui/orchestrator-ui-components';
+import { useRouter } from 'next/router';
+import React from 'react';
 
 const WorkflowDetailPage = () => {
-    const router = useRouter();
-    const { workflowId } = router.query;
+  const router = useRouter();
+  const { workflowId } = router.query;
 
-    return (
-        <>
-            {(workflowId && typeof workflowId === 'string' && (
-                <WfoProcessDetailPage processId={workflowId} />
-            )) || <div>Invalid workflowId</div>}
-        </>
-    );
+  return (
+    <>
+      {(workflowId && typeof workflowId === 'string' && (
+        <WfoProcessDetailPage processId={workflowId} />
+      )) || <div>Invalid workflowId</div>}
+    </>
+  );
 };
 
 export default WorkflowDetailPage;

pages/workflows/index.tsx

-import React from 'react';
-
 import {
-    PolicyResource,
-    WfoPolicyRenderPageFallback,
-    WfoWorkflowsListPage,
+  PolicyResource,
+  WfoPolicyRenderPageFallback,
+  WfoWorkflowsListPage,
 } from '@orchestrator-ui/orchestrator-ui-components';
+import React from 'react';
 
 export default function WorkflowsPage() {
-    return (
-        <WfoPolicyRenderPageFallback
-            resource={PolicyResource.NAVIGATION_WORKFLOWS}
-        >
-            <WfoWorkflowsListPage />
-        </WfoPolicyRenderPageFallback>
-    );
+  return (
+    <WfoPolicyRenderPageFallback resource={PolicyResource.NAVIGATION_WORKFLOWS}>
+      <WfoWorkflowsListPage />
+    </WfoPolicyRenderPageFallback>
+  );
 }

pages/workflows/new/[workflowName].tsx

-import React from 'react';
-
-import { useRouter } from 'next/router';
-
 import { WfoStartProcessPage } from '@orchestrator-ui/orchestrator-ui-components';
+import { useRouter } from 'next/router';
+import React from 'react';
 
 const StartWorkflowPage = () => {
-    const router = useRouter();
-    const { workflowName } = router.query;
+  const router = useRouter();
+  const { workflowName } = router.query;
 
-    if (workflowName && typeof workflowName === 'string') {
-        return (
-            <WfoStartProcessPage isTask={false} processName={workflowName} />
-        );
-    }
+  if (workflowName && typeof workflowName === 'string') {
+    return <WfoStartProcessPage isTask={false} processName={workflowName} />;
+  }
 
-    return <div>Invalid arguments provided</div>;
+  return <div>Invalid arguments provided</div>;
 };
 
 export default StartWorkflowPage;

pages/workflows/new/index.tsx

-import { useEffect } from 'react';
-
-import { useRouter } from 'next/router';
-
 import { PATH_WORKFLOWS } from '@orchestrator-ui/orchestrator-ui-components';
+import { useRouter } from 'next/router';
+import { useEffect } from 'react';
 
 const IndexPage = () => {
-    const router = useRouter();
+  const router = useRouter();
 
-    useEffect(() => {
-        router.push(PATH_WORKFLOWS);
-    }, [router]);
+  useEffect(() => {
+    router.push(PATH_WORKFLOWS);
+  }, [router]);
 
-    return null;
+  return null;
 };
 
 export default IndexPage;

translations/translationsProvider.tsx

-import React from 'react';
-import type { ReactNode } from 'react';
-
+import enGB from './en-GB.json';
+import {
+  Locale,
+  useGetTranslationMessages,
+} from '@orchestrator-ui/orchestrator-ui-components';
 import { merge } from 'lodash';
 import { IntlErrorCode, IntlProvider } from 'next-intl';
 import { useRouter } from 'next/router';
-
-import {
-    Locale,
-    useGetTranslationMessages,
-} from '@orchestrator-ui/orchestrator-ui-components';
-
-import enGB from './en-GB.json';
+import React from 'react';
+import type { ReactNode } from 'react';
 
 interface TranslationsProviderProps {
-    children: ReactNode;
+  children: ReactNode;
 }
 
 export const TranslationsProvider = ({
-    children,
+  children,
 }: TranslationsProviderProps) => {
-    const { locale } = useRouter();
-
-    const standardMessages = useGetTranslationMessages(locale);
-
-    const getCustomMessages = () => {
-        switch (locale) {
-            case Locale.enGB:
-                return enGB;
-            default:
-                return enGB;
-        }
-    };
-
-    const onError = (error: { code: IntlErrorCode }) => {
-        if (
-            error &&
-            error.code &&
-            error.code !== IntlErrorCode.MISSING_MESSAGE &&
-            error.code !== IntlErrorCode.INSUFFICIENT_PATH
-        ) {
-            // Missing translations are expected and normal in the context of the
-            // forms module (see UserInputForm.tsx) so we silently discard them
-            // TODO: Think of a place to better log missing translations keys that shouldn't be missing
-            console.error(error);
-        }
-    };
-
-    const messages = merge(standardMessages, getCustomMessages());
-
-    return (
-        <IntlProvider
-            locale={locale || Locale.enGB}
-            messages={messages}
-            onError={onError}
-        >
-            {children}
-        </IntlProvider>
-    );
+  const { locale } = useRouter();
+
+  const standardMessages = useGetTranslationMessages(locale);
+
+  const getCustomMessages = () => {
+    switch (locale) {
+      case Locale.enGB:
+        return enGB;
+      default:
+        return enGB;
+    }
+  };
+
+  const onError = (error: { code: IntlErrorCode }) => {
+    if (
+      error &&
+      error.code &&
+      error.code !== IntlErrorCode.MISSING_MESSAGE &&
+      error.code !== IntlErrorCode.INSUFFICIENT_PATH
+    ) {
+      // Missing translations are expected and normal in the context of the
+      // forms module (see UserInputForm.tsx) so we silently discard them
+      // TODO: Think of a place to better log missing translations keys that shouldn't be missing
+      console.error(error);
+    }
+  };
+
+  const messages = merge(standardMessages, getCustomMessages());
+
+  return (
+    <IntlProvider
+      locale={locale || Locale.enGB}
+      messages={messages}
+      onError={onError}
+    >
+      {children}
+    </IntlProvider>
+  );
 };