EPMRPP-94014 || Empty state for user without any assignments

app/src/controllers/project/sagas.js

@@ -416,7 +416,7 @@ function* watchUpdatePAState() {
 
 function* fetchProject({ payload: { projectKey, fetchInfoOnly } }) {
   try {
-    let project;
+    let project = null;
     if (projectKey) {
       project = yield call(fetch, URLS.projectByName(projectKey));
       yield put(setProjectIntegrationsAction(project.integrations));

app/src/controllers/user/sagas.js

@@ -187,13 +187,11 @@ function* fetchUserWorker() {
 
     if (!isAssignedToTargetProject && assignmentNotRequired) {
       try {
-        // TODO: Fetch project by slug
         const organizationProjects = yield call(
           fetch,
-          URLS.organizationProjects(activeOrganization?.id),
+          URLS.organizationProjects(activeOrganization?.id, { slug: activeOrganization?.slug }),
         );
-        projectKey = organizationProjects?.items?.find(({ slug }) => slug === targetProjectSlug)
-          ?.key;
+        projectKey = organizationProjects?.items?.[0]?.key;
       } catch (e) {} // eslint-disable-line no-empty
     }
 

app/src/layouts/instanceLayout/instanceSidebar/instanceSidebar.jsx

@@ -120,7 +120,7 @@ export const InstanceSidebar = ({ onClickNavBtn }) => {
       }),
     );
 
-    return noAssignedOrganizations ? [] : sidebarItems;
+    return sidebarItems;
   };
 
   const link = { type: ORGANIZATIONS_PAGE };

app/src/pages/instance/organizationsPage/noAssignedEmptyPage/index.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2019 EPAM Systems
+ * Copyright 2024 EPAM Systems
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.

app/src/pages/instance/organizationsPage/noAssignedEmptyPage/noAssignedEmptyPage.jsx

@@ -1,5 +1,5 @@
 /*
- * Copyright 2019 EPAM Systems
+ * Copyright 2024 EPAM Systems
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -21,8 +21,9 @@ import { fullNameSelector } from 'controllers/user/selectors';
 import OpenIcon from 'common/img/open-in-rounded-inline.svg';
 import { SAAS } from 'controllers/appInfo/constants';
 import { useIntl } from 'react-intl';
+import { instanceTypeSelector } from 'controllers/appInfo/selectors';
 import RocketIcon from '../img/rocket-inline.svg';
-import FooterIcon from '../img/footer-inline.svg';
+import FooterImg from '../img/footer.png';
 import { messages } from './messages';
 import styles from './noAssignedEmptyPage.scss';
 
@@ -31,25 +32,26 @@ const cx = classNames.bind(styles);
 export const NoAssignedEmptyPage = () => {
   const { formatMessage } = useIntl();
   const fullName = useSelector(fullNameSelector);
-  const isSaaS = process.env.SAAS !== SAAS;
+  const instanceType = useSelector(instanceTypeSelector);
+  const isSaaS = instanceType !== SAAS;
   const description = isSaaS
     ? formatMessage(messages.descriptionSaaS)
     : formatMessage(messages.description);
 
   const getSaasRender = () => {
     return (
       <div className={cx('saas-container')}>
-        <div className={cx('block')}>
-          <div className={cx('block-title')}>{formatMessage(messages.existingOrganization)}</div>
-          <div className={cx('block-description')}>{formatMessage(messages.invitations)}</div>
-        </div>
+        <section className={cx('block')}>
+          <h2 className={cx('block-title')}>{formatMessage(messages.existingOrganization)}</h2>
+          <p className={cx('block-description')}>{formatMessage(messages.invitations)}</p>
+        </section>
         <div className={cx('separator-container')}>
           <div className={cx('text')}>{formatMessage(messages.or)}</div>
           <div className={cx('separator')} />
         </div>
-        <div className={cx('block')}>
-          <div className={cx('block-title')}>{formatMessage(messages.createOwnOrganization)}</div>
-          <div className={cx('block-description')}>{formatMessage(messages.contactUs)}</div>
+        <section className={cx('block')}>
+          <h2 className={cx('block-title')}>{formatMessage(messages.createOwnOrganization)}</h2>
+          <p className={cx('block-description')}>{formatMessage(messages.contactUs)}</p>
           <a
             href="https://reportportal.io/pricing/saas"
             className={cx('link-container')}
@@ -59,7 +61,7 @@ export const NoAssignedEmptyPage = () => {
             <div className={cx('link')}>{formatMessage(messages.reviewPricing)}</div>
             <div className={cx('open-icon')}>{Parser(OpenIcon)}</div>
           </a>
-        </div>
+        </section>
       </div>
     );
   };
@@ -72,7 +74,7 @@ export const NoAssignedEmptyPage = () => {
         <div className={cx('description')}>{description}</div>
         {isSaaS && getSaasRender()}
       </div>
-      <div className={cx('footer-icon')}>{Parser(FooterIcon)}</div>
+      <img className={cx('footer-icon')} src={FooterImg} alt="footer" />
     </div>
   );
 };

app/src/pages/instance/organizationsPage/noAssignedEmptyPage/noAssignedEmptyPage.scss

@@ -1,5 +1,5 @@
 /*
- * Copyright 2019 EPAM Systems
+ * Copyright 2024 EPAM Systems
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -23,7 +23,8 @@
 .footer-icon {
   position: absolute;
   bottom: 0;
-  width: 100%;
+  width: 100vw;
+  left: -48px;
 }
 
 .content {

app/src/pages/instance/organizationsPage/organizationsPageHeader/index.js

@@ -1,5 +1,5 @@
 /*
- * Copyright 2019 EPAM Systems
+ * Copyright 2024 EPAM Systems
  *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.