Add validations to organization feature

Add validations to check whether the logged in user has an organization and organizations are available in the environment

Author: SavinduDimal

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/ShareAPI/ShareAPI.jsx

@@ -47,10 +47,10 @@ const classes = {
     helpIcon: `${PREFIX}-helpIcon`,
     htmlTooltip: `${PREFIX}-htmlTooltip`,
     buttonSection: `${PREFIX}-buttonSection`,
-    emptyBox: `${PREFIX}-emptyBox`
+    emptyBox: `${PREFIX}-emptyBox`,
+    shareAPIPaper: `${PREFIX}-shareAPIPaper`
 }
 
-
 const Root = styled('div')((
     {
         theme
@@ -62,6 +62,11 @@ const Root = styled('div')((
 
     [`& .${classes.emptyBox}`]: {
         marginTop: theme.spacing(2),
+    },
+
+    [`& .${classes.shareAPIPaper}`]: {
+        padding: theme.spacing(2),
+        marginTop: theme.spacing(2),
     }
 }));
 
@@ -175,28 +180,44 @@ function ShareAPI(props) {
                     defaultMessage='Share API'
                 />
             </Typography>
-            <SharedOrganizations
-                api={api}
-                organizations={organizations}
-                visibleOrganizations={visibleOrganizations}
-                setVisibleOrganizations = {setVisibleOrganizations}
-                selectionMode = {selectionMode}
-                setSelectionMode = {setSelectionMode}
-            />
-            {(api.gatewayVendor === 'wso2') &&
-            (   
-                <>
-                    {organizations?.list?.length > 0 && selectionMode !== "none" &&
-                        <OrganizationSubscriptionPoliciesManage
-                            api={api}
-                            organizations={organizations.list}
-                            visibleOrganizations={visibleOrganizations}
-                            organizationPolicies={organizationPolicies}
-                            setOrganizationPolicies={setOrganizationPolicies}
-                            selectionMode = {selectionMode}
-                        />
-                    }
-                </>
+            {organizations?.list?.length === 0 ? (
+                <Paper className={classes.shareAPIPaper}>
+                    <Box display='flex' alignItems='center' >
+                        <FormLabel component='legend' style={{ marginTop: 8, marginBottom: 8}}>
+                            <FormattedMessage
+                                id='Apis.Details.Configuration.components.Share.API.no.organizations'
+                                defaultMessage='No organizations are currently registered under your current organization to share the API.'
+                            />
+                        </FormLabel>
+                    </Box>
+                </Paper>
+            ) : (
+                <div>
+                    <SharedOrganizations
+                        api={api}
+                        organizations={organizations}
+                        visibleOrganizations={visibleOrganizations}
+                        setVisibleOrganizations = {setVisibleOrganizations}
+                        selectionMode = {selectionMode}
+                        setSelectionMode = {setSelectionMode}
+                        subValidationDisablingAllowed={settings.allowSubscriptionValidationDisabling}
+                    />
+                    {(api.gatewayVendor === 'wso2') &&
+                    (   
+                        <>
+                            {organizations?.list?.length > 0 && selectionMode !== "none" &&
+                                <OrganizationSubscriptionPoliciesManage
+                                    api={api}
+                                    organizations={organizations.list}
+                                    visibleOrganizations={visibleOrganizations}
+                                    organizationPolicies={organizationPolicies}
+                                    setOrganizationPolicies={setOrganizationPolicies}
+                                    selectionMode = {selectionMode}
+                                />
+                            }
+                        </>
+                    )}
+                </div>
             )}
             {(api.gatewayVendor === 'wso2') && (
                 <Grid
@@ -211,7 +232,7 @@ function ShareAPI(props) {
                             type='submit'
                             variant='contained'
                             color='primary'
-                            disabled={updateInProgress || api.isRevision 
+                            disabled={organizations?.list?.length === 0  || updateInProgress || api.isRevision 
                                 || isRestricted(['apim:api_create', 'apim:api_publish'], api)}
                             onClick={() => handleShareAPISave()}
                             id='share-api-save-btn'

portals/publisher/src/main/webapp/source/src/app/components/Apis/Details/components/APIDetailsTopMenu.jsx

@@ -186,6 +186,19 @@ const APIDetailsTopMenu = (props) => {
         }),
     };
 
+    const [userOrg, setUserOrg] = useState(null);
+
+    useEffect(() => {
+        new API()
+            .getUserOrganizationInfo()
+            .then((result) => {
+                setUserOrg(result.body.organizationId);
+            })
+            .catch((error) => {
+                throw error;
+            });
+    }, []);
+
     /**
          * The component for advanced endpoint configurations.
          * @param {string} name The name of the
@@ -467,7 +480,7 @@ const APIDetailsTopMenu = (props) => {
                 )}
                 {/* Page error banner */}
                 {/* end of Page error banner */}
-                {api.apiType !== API.CONSTS.APIProduct && isVisibleInStore
+                {api.apiType !== API.CONSTS.APIProduct && isVisibleInStore && userOrg 
                     ? <>
                         <ShareButton buttonClass={classes.viewInStoreLauncher}
                             api={api} isAPIProduct={isAPIProduct} />