ui layout added for images inside image pull secrets

src/apps/auth/routes/_main+/oauth2.callback.$provider.tsx

@@ -1,11 +1,12 @@
-import { useNavigate, useLoaderData } from '@remix-run/react';
-import getQueries from '~/root/lib/server/helpers/get-queries';
+import { useLoaderData, useNavigate, useSearchParams } from '@remix-run/react';
+import { useAuthApi } from '~/auth/server/gql/api-provider';
 import { BrandLogo } from '~/components/branding/brand-logo';
 import { toast } from '~/components/molecule/toast';
-import { handleError } from '~/root/lib/utils/common';
-import { IRemixCtx } from '~/root/lib/types/common';
+import { base64Encrypt } from '~/console/server/utils/common';
 import useDebounce from '~/root/lib/client/hooks/use-debounce';
-import { useAuthApi } from '~/auth/server/gql/api-provider';
+import getQueries from '~/root/lib/server/helpers/get-queries';
+import { IRemixCtx } from '~/root/lib/types/common';
+import { handleError } from '~/root/lib/utils/common';
 
 export const decodeState = (str: string) =>
   Buffer.from(str, 'base64url').toString('utf8');
@@ -14,6 +15,8 @@ const CallBack = () => {
   const { query, state, provider, setupAction } = useLoaderData();
   const api = useAuthApi();
   const navigate = useNavigate();
+  const [searchParams, _setSearchParams] = useSearchParams();
+
   useDebounce(
     () => {
       (async () => {
@@ -69,6 +72,15 @@ const CallBack = () => {
             navigate('/');
           } else {
             toast.success('Login Successful');
+            const callback = searchParams.get('callback');
+            if (callback) {
+              const {
+                data: { email, name },
+              } = await api.whoAmI({});
+              const encodedData = base64Encrypt(`email=${email}&name=${name}`);
+              window.location.href = `${callback}?${encodedData}`;
+              return;
+            }
             navigate('/');
           }
         } catch (err) {

src/apps/auth/routes/_providers+/login.tsx

@@ -5,17 +5,18 @@ import {
   GitlabLogoFill,
   GoogleLogo,
 } from '@jengaicons/react';
-import { useSearchParams, Link, useOutletContext } from '@remix-run/react';
+import { Link, useOutletContext, useSearchParams } from '@remix-run/react';
+import { useAuthApi } from '~/auth/server/gql/api-provider';
+import { Button } from '~/components/atoms/button';
 import { PasswordInput, TextInput } from '~/components/atoms/input';
+import { ArrowLeft, ArrowRight } from '~/components/icons';
+import { toast } from '~/components/molecule/toast';
+import { cn } from '~/components/utils';
+import { base64Encrypt } from '~/console/server/utils/common';
+import { useReload } from '~/root/lib/client/helpers/reloader';
 import useForm from '~/root/lib/client/hooks/use-form';
 import Yup from '~/root/lib/server/helpers/yup';
-import { useReload } from '~/root/lib/client/helpers/reloader';
 import { handleError } from '~/root/lib/utils/common';
-import { toast } from '~/components/molecule/toast';
-import { Button } from '~/components/atoms/button';
-import { cn } from '~/components/utils';
-import { useAuthApi } from '~/auth/server/gql/api-provider';
-import { ArrowLeft, ArrowRight } from '~/components/icons';
 import Container from '../../components/container';
 import { IProviderContext } from './_layout';
 
@@ -25,6 +26,7 @@ const CustomGoogleIcon = (props: any) => {
 
 const LoginWithEmail = () => {
   const api = useAuthApi();
+  const [searchParams, _setSearchParams] = useSearchParams();
 
   const reloadPage = useReload();
   const { values, errors, handleChange, handleSubmit, isLoading } = useForm({
@@ -46,6 +48,16 @@ const LoginWithEmail = () => {
           throw _errors[0];
         }
         toast.success('logged in success fully');
+
+        const callback = searchParams.get('callback');
+        if (callback) {
+          const {
+            data: { email, name },
+          } = await api.whoAmI({});
+          const encodedData = base64Encrypt(`email=${email}&name=${name}`);
+          window.location.href = `${callback}?${encodedData}`;
+          return;
+        }
         reloadPage();
       } catch (err) {
         handleError(err);

src/apps/console/page-components/handle-environment.tsx

@@ -8,6 +8,7 @@ import Yup from '~/root/lib/server/helpers/yup';
 import { handleError } from '~/root/lib/utils/common';
 import { NameIdView } from '../components/name-id-view';
 import { IDialog } from '../components/types.d';
+import { findClusterStatus } from '../hooks/use-cluster-status';
 import { useConsoleApi } from '../server/gql/api-provider';
 import { IEnvironment } from '../server/gql/queries/environment-queries';
 import { parseName, parseNodes } from '../server/r-utils/common';
@@ -42,7 +43,7 @@ const HandleEnvironment = ({ show, setShow }: IDialog<IEnvironment | null>) => {
       const data = parseNodes(byokClusters.data).map((c) => ({
         label: c.displayName,
         value: parseName(c),
-        ready: true,
+        ready: findClusterStatus(c),
         render: () => (
           <ClusterSelectItem label={c.displayName} value={parseName(c)} />
         ),

src/apps/console/routes/_main+/$account+/env+/$environment+/app+/$app+/settings+/_layout.tsx

@@ -1,39 +1,39 @@
 import { Outlet, useOutletContext } from '@remix-run/react';
-import SidebarLayout from '~/console/components/sidebar-layout';
-import {
-  UnsavedChangesProvider,
-  useUnsavedChanges,
-} from '~/lib/client/hooks/use-unsaved-changes';
+import { useEffect, useState } from 'react';
+import { Button } from '~/components/atoms/button';
 import Popup from '~/components/molecule/popup';
-import { handleError } from '~/lib/utils/common';
 import { toast } from '~/components/molecule/toast';
-import { getAppIn } from '~/console/server/r-utils/resource-getter';
-import useForm from '~/lib/client/hooks/use-form';
-import { useConsoleApi } from '~/console/server/gql/api-provider';
-import { useEffect, useState } from 'react';
+import { cn } from '~/components/utils';
+import { DiffViewer, yamlDump } from '~/console/components/diff-viewer';
+import SidebarLayout from '~/console/components/sidebar-layout';
 import {
   AppContextProvider,
   useAppState,
 } from '~/console/page-components/app-states';
-import Yup from '~/lib/server/helpers/yup';
-import { DiffViewer, yamlDump } from '~/console/components/diff-viewer';
-import { useReload } from '~/lib/client/helpers/reloader';
-import { keyconstants } from '~/console/server/r-utils/key-constants';
+import { useConsoleApi } from '~/console/server/gql/api-provider';
 import { parseName } from '~/console/server/r-utils/common';
+import { keyconstants } from '~/console/server/r-utils/key-constants';
+import { getAppIn } from '~/console/server/r-utils/resource-getter';
 import { constants } from '~/console/server/utils/constants';
+import { useReload } from '~/lib/client/helpers/reloader';
+import useForm from '~/lib/client/hooks/use-form';
+import {
+  UnsavedChangesProvider,
+  useUnsavedChanges,
+} from '~/lib/client/hooks/use-unsaved-changes';
+import Yup from '~/lib/server/helpers/yup';
+import { handleError } from '~/lib/utils/common';
 import { registryHost } from '~/root/lib/configs/base-url.cjs';
-import { Button } from '~/components/atoms/button';
-import { cn } from '~/components/utils';
-import { IAppContext } from '../_layout';
-import { getImageTag } from '../../../new-app/app-utils';
 import appFun from '../../../new-app/app-pre-submit';
+import { getImageTag } from '../../../new-app/app-utils';
+import { IAppContext } from '../_layout';
 
 const navItems = [
   { label: 'General', value: 'general' },
   { label: 'Compute', value: 'compute' },
   { label: 'Environment', value: 'environment' },
   { label: 'Network', value: 'network' },
-  { label: 'Advance', value: 'advance' },
+  { label: 'Advanced', value: 'advance' },
 ];
 
 const Layout = () => {

src/apps/console/routes/_main+/$account+/env+/$environment+/app+/$app+/settings+/advance/route.tsx

@@ -1,21 +1,21 @@
 import { useNavigate, useOutletContext } from '@remix-run/react';
 import { useState } from 'react';
 import { Button } from '~/components/atoms/button';
+import { toast } from '~/components/molecule/toast';
 import {
   Box,
   DeleteContainer,
 } from '~/console/components/common-console-components';
-import { useAppState } from '~/console/page-components/app-states';
-import { parseName } from '~/console/server/r-utils/common';
 import DeleteDialog from '~/console/components/delete-dialog';
-import { useReload } from '~/lib/client/helpers/reloader';
-import { useConsoleApi } from '~/console/server/gql/api-provider';
-import { toast } from '~/components/molecule/toast';
-import { handleError } from '~/lib/utils/common';
 import Wrapper from '~/console/components/wrapper';
-import { useUnsavedChanges } from '~/lib/client/hooks/use-unsaved-changes';
 import YamlEditorOverlay from '~/console/components/yaml-editor-overlay';
+import { useAppState } from '~/console/page-components/app-states';
+import { useConsoleApi } from '~/console/server/gql/api-provider';
+import { parseName } from '~/console/server/r-utils/common';
 import { getAppIn } from '~/console/server/r-utils/resource-getter';
+import { useReload } from '~/lib/client/helpers/reloader';
+import { useUnsavedChanges } from '~/lib/client/hooks/use-unsaved-changes';
+import { handleError } from '~/lib/utils/common';
 import { IAppContext } from '../../_layout';
 
 const SettingAdvance = () => {
@@ -56,7 +56,7 @@ const SettingAdvance = () => {
     <div>
       <Wrapper
         secondaryHeader={{
-          title: 'Advance',
+          title: 'Advanced',
           action: hasChanges && (
             <div className="flex flex-row items-center gap-lg">
               <Button

src/apps/console/routes/_main+/$account+/environments/clone-environment.tsx

@@ -6,6 +6,7 @@ import { toast } from '~/components/molecule/toast';
 import CommonPopupHandle from '~/console/components/common-popup-handle';
 import { NameIdView } from '~/console/components/name-id-view';
 import { IDialogBase } from '~/console/components/types.d';
+import { findClusterStatus } from '~/console/hooks/use-cluster-status';
 import { useConsoleApi } from '~/console/server/gql/api-provider';
 import { IEnvironments } from '~/console/server/gql/queries/environment-queries';
 import {
@@ -50,7 +51,7 @@ const Root = (props: IDialog) => {
       const data = parseNodes(byokClusters.data).map((c) => ({
         label: c.displayName,
         value: parseName(c),
-        ready: true,
+        ready: findClusterStatus(c),
         render: () => (
           <ClusterSelectItem label={c.displayName} value={parseName(c)} />
         ),

src/apps/console/routes/_main+/$account+/environments/environment-resources-v2.tsx

@@ -94,7 +94,7 @@ const ExtraButton = ({
         options = [
           ...options,
           {
-            label: 'Resumed',
+            label: 'Resume',
             icon: <Play size={iconSize} />,
             type: 'item',
             key: 'resumed',

src/apps/console/routes/_main+/$account+/new-managed-service/_index.tsx

@@ -1,4 +1,4 @@
-import { useNavigate, useOutletContext } from '@remix-run/react';
+import { useNavigate, useOutletContext, useParams } from '@remix-run/react';
 import {
   FormEventHandler,
   ReactNode,
@@ -21,13 +21,15 @@ import MultiStepProgress, {
 } from '~/console/components/multi-step-progress';
 import MultiStepProgressWrapper from '~/console/components/multi-step-progress-wrapper';
 import { NameIdView } from '~/console/components/name-id-view';
+import { findClusterStatus } from '~/console/hooks/use-cluster-status';
 import { useConsoleApi } from '~/console/server/gql/api-provider';
 import {
   IMSvTemplate,
   IMSvTemplates,
 } from '~/console/server/gql/queries/managed-templates-queries';
 import { parseName, parseNodes } from '~/console/server/r-utils/common';
 import { keyconstants } from '~/console/server/r-utils/key-constants';
+import { ensureAccountClientSide } from '~/console/server/utils/auth-utils';
 import { flatM, flatMapValidations } from '~/console/utils/commons';
 import useForm, { dummyEvent } from '~/root/lib/client/hooks/use-form';
 import Yup from '~/root/lib/server/helpers/yup';
@@ -541,14 +543,16 @@ const ManagedServiceLayout = () => {
   });
 
   const [clusterList, setClusterList] = useState<any[]>([]);
+  const params = useParams();
 
   const getClusters = useCallback(async () => {
+    ensureAccountClientSide(params);
     try {
       const byokClusters = await api.listByokClusters({});
       const data = parseNodes(byokClusters.data).map((c) => ({
         label: c.displayName,
         value: parseName(c),
-        ready: true,
+        ready: findClusterStatus(c),
         render: () => (
           <ClusterSelectItem label={c.displayName} value={parseName(c)} />
         ),
@@ -561,7 +565,7 @@ const ManagedServiceLayout = () => {
 
   useEffect(() => {
     getClusters();
-  }, [clusterList]);
+  }, []);
 
   const { values, errors, handleSubmit, handleChange, isLoading, setValues } =
     useForm({

src/apps/console/routes/_main+/$account+/settings+/_layout.tsx

@@ -1,8 +1,14 @@
 import { Outlet, useOutletContext } from '@remix-run/react';
 import SidebarLayout from '~/console/components/sidebar-layout';
+import { useHandleFromMatches } from '~/root/lib/client/hooks/use-custom-matches';
 
 const Settings = () => {
   const rootContext = useOutletContext();
+  const noLayout = useHandleFromMatches('noLayout', null);
+
+  if (noLayout) {
+    return <Outlet context={rootContext} />;
+  }
   return (
     <SidebarLayout
       navItems={[

src/apps/console/routes/_main+/$account+/settings+/ips+/$imagepullsecret+/_layout.tsx

@@ -30,8 +30,8 @@ const ImagePullSecretsTabs = () => {
     <CommonTabs
       baseurl={`/${account}/settings/ips/${imagepullsecret}`}
       backButton={{
-        to: `/${account}/managed-services`,
-        label: 'Integrated Services',
+        to: `/${account}/settings/image-pull-secrets`,
+        label: 'Image Pull Secrets',
       }}
       tabs={[
         {
@@ -101,6 +101,7 @@ export const handle = ({
   return {
     navbar: <ImagePullSecretsTabs />,
     breadcrum: () => <LocalBreadcrum data={imagePullSecret} />,
+    noLayout: true,
   };
 };