feat: add builder type for session launchers

client/src/features/admin/DeleteSessionEnvironmentButton.tsx

@@ -20,8 +20,9 @@ import cx from "classnames";
 import { useCallback, useEffect, useState } from "react";
 import { TrashFill, XLg } from "react-bootstrap-icons";
 import { Button, Modal, ModalBody, ModalFooter, ModalHeader } from "reactstrap";
+
 import { RtkErrorAlert } from "../../components/errors/RtkErrorAlert";
-import { SessionEnvironment } from "../sessionsV2/sessionsV2.types";
+import type { Environment as SessionEnvironment } from "../sessionsV2/api/sessionLaunchersV2.api";
 import { useDeleteSessionEnvironmentMutation } from "./adminSessions.api";
 
 interface DeleteSessionEnvironmentButtonProps {

client/src/features/admin/SessionEnvironmentsSection.tsx

@@ -30,12 +30,12 @@ import { Loader } from "../../components/Loader";
 import { TimeCaption } from "../../components/TimeCaption";
 import { CommandCopy } from "../../components/commandCopy/CommandCopy";
 import { RtkErrorAlert } from "../../components/errors/RtkErrorAlert";
-import { ErrorLabel } from "../../components/formlabels/FormLabels.tsx";
-import { safeStringify } from "../sessionsV2/session.utils";
+import { ErrorLabel } from "../../components/formlabels/FormLabels";
 import type {
-  SessionEnvironment,
-  SessionEnvironmentList,
-} from "../sessionsV2/sessionsV2.types";
+  Environment as SessionEnvironment,
+  EnvironmentList as SessionEnvironmentList,
+} from "../sessionsV2/api/sessionLaunchersV2.api";
+import { safeStringify } from "../sessionsV2/session.utils";
 import AddSessionEnvironmentButton from "./AddSessionEnvironmentButton";
 import DeleteSessionEnvironmentButton from "./DeleteSessionEnvironmentButton";
 import UpdateSessionEnvironmentButton from "./UpdateSessionEnvironmentButton";

client/src/features/admin/UpdateSessionEnvironmentButton.tsx

@@ -31,8 +31,8 @@ import {
 import { Loader } from "../../components/Loader";
 import ButtonStyles from "../../components/buttons/Buttons.module.scss";
 import { RtkErrorAlert } from "../../components/errors/RtkErrorAlert";
+import type { Environment as SessionEnvironment } from "../sessionsV2/api/sessionLaunchersV2.api";
 import { safeParseJSONStringArray } from "../sessionsV2/session.utils";
-import { SessionEnvironment } from "../sessionsV2/sessionsV2.types";
 import SessionEnvironmentFormContent, {
   SessionEnvironmentForm,
 } from "./SessionEnvironmentFormContent";

client/src/features/admin/adminSessions.api.ts

@@ -18,10 +18,10 @@
 
 import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";
 
-import {
-  SessionEnvironment,
-  SessionEnvironmentList,
-} from "../sessionsV2/sessionsV2.types";
+import type {
+  Environment as SessionEnvironment,
+  EnvironmentList as SessionEnvironmentList,
+} from "../sessionsV2/api/sessionLaunchersV2.api";
 import {
   AddSessionEnvironmentParams,
   DeleteSessionEnvironmentParams,

client/src/features/admin/adminSessions.utils.ts

@@ -16,8 +16,8 @@
  * limitations under the License.
  */
 
+import type { Environment as SessionEnvironment } from "../sessionsV2/api/sessionLaunchersV2.api";
 import { getJSONStringArray } from "../sessionsV2/session.utils";
-import { SessionEnvironment } from "../sessionsV2/sessionsV2.types";
 
 export function getSessionEnvironmentValues(environment: SessionEnvironment) {
   return {

client/src/features/repositories/repositories.api.ts

@@ -18,6 +18,8 @@
 
 import { createApi, fetchBaseQuery } from "@reduxjs/toolkit/query/react";
 import {
+  GetRepositoriesProbesParams,
+  GetRepositoriesProbesResponse,
   GetRepositoryMetadataParams,
   GetRepositoryProbeParams,
   RepositoryProviderMatch,
@@ -63,9 +65,53 @@ const repositoriesApi = createApi({
           ? [{ type: "RepositoryProbe" as const, id: repositoryUrl }]
           : [],
     }),
+    getRepositoriesProbes: builder.query<
+      GetRepositoriesProbesResponse,
+      GetRepositoriesProbesParams
+    >({
+      async queryFn(queryArg, _api, _options, fetchWithBQ) {
+        const { repositoriesUrls } = queryArg;
+        const result: GetRepositoriesProbesResponse = [];
+        const promises = repositoriesUrls.map((repositoryUrl) =>
+          fetchWithBQ({
+            url: `${encodeURIComponent(repositoryUrl)}/probe`,
+            validateStatus: (response) => {
+              return (
+                (response.status >= 200 && response.status < 300) ||
+                response.status == 404
+              );
+            },
+          })
+        );
+        const responses = await Promise.all(promises);
+        for (let i = 0; i < repositoriesUrls.length; i++) {
+          const repositoryUrl = repositoriesUrls[i];
+          const response = responses[i];
+          if (response.error) return response;
+          const status = response.meta?.response?.status;
+          const probe = status != null && status >= 200 && status < 300;
+          result.push({
+            repositoryUrl,
+            probe,
+          });
+        }
+
+        return { data: result };
+      },
+      providesTags: (result) =>
+        result != null
+          ? result.map(({ repositoryUrl }) => ({
+              type: "RepositoryProbe" as const,
+              id: repositoryUrl,
+            }))
+          : [],
+    }),
   }),
 });
 
 export default repositoriesApi;
-export const { useGetRepositoryMetadataQuery, useGetRepositoryProbeQuery } =
-  repositoriesApi;
+export const {
+  useGetRepositoryMetadataQuery,
+  useGetRepositoryProbeQuery,
+  useGetRepositoriesProbesQuery,
+} = repositoriesApi;

client/src/features/repositories/repositories.types.ts

@@ -33,10 +33,21 @@ export interface RepositoryPermissions {
   push: boolean;
 }
 
+export interface RepositoryWithProbe {
+  repositoryUrl: string;
+  probe: boolean;
+}
+
 export interface GetRepositoryMetadataParams {
   repositoryUrl: string;
 }
 
 export interface GetRepositoryProbeParams {
   repositoryUrl: string;
 }
+
+export type GetRepositoriesProbesResponse = RepositoryWithProbe[];
+
+export interface GetRepositoriesProbesParams {
+  repositoriesUrls: string[];
+}

client/src/features/sessionsV2/DeleteSessionLauncherModal.tsx

@@ -23,8 +23,8 @@ import { Button, Modal, ModalBody, ModalFooter, ModalHeader } from "reactstrap";
 
 import { WarnAlert } from "../../components/Alert";
 import { RtkErrorAlert } from "../../components/errors/RtkErrorAlert";
+import type { SessionLauncher } from "./api/sessionLaunchersV2.api";
 import { useDeleteSessionLaunchersByLauncherIdMutation as useDeleteSessionLauncherMutation } from "./api/sessionLaunchersV2.api";
-import { SessionLauncher } from "./sessionsV2.types";
 
 interface DeleteSessionLauncherModalProps {
   isOpen: boolean;

client/src/features/sessionsV2/SessionList/SessionItem.tsx

@@ -22,13 +22,14 @@ import { Col, ListGroupItem, Row } from "reactstrap";
 import { Project } from "../../projectsV2/api/projectV2.api";
 import { getShowSessionUrlByProject } from "../SessionsV2";
 import StartSessionButton from "../StartSessionButton";
+import type { SessionLauncher } from "../api/sessionLaunchersV2.api";
 import ActiveSessionButton from "../components/SessionButton/ActiveSessionButton";
 import {
   SessionBadge,
   SessionStatusV2Description,
   SessionStatusV2Label,
 } from "../components/SessionStatus/SessionStatus";
-import { SessionLauncher, SessionV2 } from "../sessionsV2.types";
+import { SessionV2 } from "../sessionsV2.types";
 
 interface SessionItemProps {
   launcher?: SessionLauncher;

client/src/features/sessionsV2/SessionList/SessionItemDisplay.tsx

@@ -20,8 +20,8 @@ import { useCallback, useMemo } from "react";
 
 import useLocationHash from "../../../utils/customHooks/useLocationHash.hook";
 import { Project } from "../../projectsV2/api/projectV2.api";
+import type { SessionLauncher } from "../api/sessionLaunchersV2.api";
 import { useGetSessionsQuery as useGetSessionsQueryV2 } from "../api/sessionsV2.api";
-import { SessionLauncher } from "../sessionsV2.types";
 import { SessionView } from "../SessionView/SessionView";
 import SessionItem from "./SessionItem";
 

client/src/features/sessionsV2/SessionStartPage.tsx

@@ -58,13 +58,13 @@ import { useGetNamespacesByNamespaceProjectsAndSlugQuery } from "../projectsV2/a
 import { storageSecretNameToFieldName } from "../secretsV2/secrets.utils";
 import DataConnectorSecretsModal from "./DataConnectorSecretsModal";
 import SessionSecretsModal from "./SessionSecretsModal";
+import type { SessionLauncher } from "./api/sessionLaunchersV2.api";
 import { useGetProjectsByProjectIdSessionLaunchersQuery as useGetProjectSessionLaunchersQuery } from "./api/sessionLaunchersV2.api";
 import {
   useGetSessionsImagesQuery as useGetDockerImageQuery,
   usePostSessionsMutation as useLaunchSessionMutation,
 } from "./api/sessionsV2.api";
 import { SelectResourceClassModal } from "./components/SessionModals/SelectResourceClass";
-import { SessionLauncher } from "./sessionsV2.types";
 import startSessionOptionsV2Slice from "./startSessionOptionsV2.slice";
 import {
   SessionStartDataConnectorConfiguration,

client/src/features/sessionsV2/SessionView/EnvironmentCard.tsx

@@ -18,12 +18,20 @@
 
 import cx from "classnames";
 import { ReactNode } from "react";
-import { Clock, Globe2, Link45deg } from "react-bootstrap-icons";
-import { Card, CardBody, Col, Row } from "reactstrap";
+import {
+  CircleFill,
+  Clock,
+  Globe2,
+  Link45deg,
+  Tools,
+} from "react-bootstrap-icons";
+import { Badge, Card, CardBody, Col, Row } from "reactstrap";
+
 import { ErrorLabel } from "../../../components/formlabels/FormLabels";
 import { toHumanDateTime } from "../../../utils/helpers/DateTimeUtils";
+import type { SessionLauncher } from "../api/sessionLaunchersV2.api";
+import { BUILDER_IMAGE_NOT_READY_VALUE } from "../session.constants";
 import { safeStringify } from "../session.utils";
-import { SessionLauncher } from "../sessionsV2.types";
 
 export function EnvironmentCard({ launcher }: { launcher: SessionLauncher }) {
   const environment = launcher.environment;
@@ -42,15 +50,20 @@ export function EnvironmentCard({ launcher }: { launcher: SessionLauncher }) {
               </h5>
             </EnvironmentRow>
             <EnvironmentRow>
-              {environment.environment_kind === "CUSTOM" ? (
+              {environment.environment_kind === "GLOBAL" ? (
                 <>
-                  <Link45deg size={24} />
-                  Custom image
+                  <Globe2 size={24} />
+                  Global environment
+                </>
+              ) : environment.environment_image_source === "build" ? (
+                <>
+                  <Tools size={24} />
+                  Built by RenkuLab
                 </>
               ) : (
                 <>
-                  <Globe2 size={24} />
-                  Global environment
+                  <Link45deg size={24} />
+                  Custom image
                 </>
               )}
             </EnvironmentRow>
@@ -89,7 +102,17 @@ export function EnvironmentCard({ launcher }: { launcher: SessionLauncher }) {
   );
 }
 
-export function CustomEnvironmentValues({
+function CustomEnvironmentValues({ launcher }: { launcher: SessionLauncher }) {
+  const { environment } = launcher;
+
+  if (environment.environment_image_source === "image") {
+    return <CustomImageEnvironmentValues launcher={launcher} />;
+  }
+
+  return <CustomBuildEnvironmentValues launcher={launcher} />;
+}
+
+function CustomImageEnvironmentValues({
   launcher,
 }: {
   launcher: SessionLauncher;
@@ -133,7 +156,44 @@ export function CustomEnvironmentValues({
   );
 }
 
-function EnvironmentRow({ children }: { children: ReactNode }) {
+function CustomBuildEnvironmentValues({
+  launcher,
+}: {
+  launcher: SessionLauncher;
+}) {
+  const { environment } = launcher;
+
+  if (environment.environment_image_source !== "build") {
+    return null;
+  }
+
+  const { build_parameters } = environment;
+  const { builder_variant, frontend_variant, repository } = build_parameters;
+
+  return (
+    <>
+      <EnvironmentRow>
+        {environment.container_image === BUILDER_IMAGE_NOT_READY_VALUE ? (
+          <NotReadyStatusBadge />
+        ) : (
+          <ReadyStatusBadge />
+        )}
+      </EnvironmentRow>
+
+      <EnvironmentRowWithLabel label="Repository" value={repository || ""} />
+      <EnvironmentRowWithLabel
+        label="Environment type"
+        value={builder_variant || ""}
+      />
+      <EnvironmentRowWithLabel
+        label="User interface"
+        value={frontend_variant || ""}
+      />
+    </>
+  );
+}
+
+function EnvironmentRow({ children }: { children?: ReactNode }) {
   return (
     <Col
       xs={12}
@@ -181,3 +241,41 @@ function EnvironmentJSONArrayRowWithLabel({
     </EnvironmentRow>
   );
 }
+
+function ReadyStatusBadge() {
+  return (
+    <Badge
+      className={cx(
+        "border",
+        "bg-success-subtle",
+        "border-success",
+        "text-success-emphasis",
+        "fs-small",
+        "fw-normal"
+      )}
+      pill
+    >
+      <CircleFill className={cx("bi", "me-1")} />
+      Ready
+    </Badge>
+  );
+}
+
+function NotReadyStatusBadge() {
+  return (
+    <Badge
+      className={cx(
+        "border",
+        "bg-danger-subtle",
+        "border-danger",
+        "text-danger-emphasis",
+        "fs-small",
+        "fw-normal"
+      )}
+      pill
+    >
+      <CircleFill className={cx("bi", "me-1")} />
+      Not ready
+    </Badge>
+  );
+}

client/src/features/sessionsV2/SessionView/SessionView.tsx

@@ -39,6 +39,7 @@ import {
   Row,
   UncontrolledTooltip,
 } from "reactstrap";
+
 import { TimeCaption } from "../../../components/TimeCaption";
 import { CommandCopy } from "../../../components/commandCopy/CommandCopy";
 import { RepositoryItem } from "../../ProjectPageV2/ProjectPageContent/CodeRepositories/CodeRepositoryDisplay";
@@ -55,6 +56,7 @@ import { useGetProjectsByProjectIdDataConnectorLinksQuery } from "../../projects
 import { SessionRowResourceRequests } from "../../session/components/SessionsList";
 import { SessionV2Actions, getShowSessionUrlByProject } from "../SessionsV2";
 import StartSessionButton from "../StartSessionButton";
+import type { SessionLauncher } from "../api/sessionLaunchersV2.api";
 import ActiveSessionButton from "../components/SessionButton/ActiveSessionButton";
 import { ModifyResourcesLauncherModal } from "../components/SessionModals/ModifyResourcesLauncher";
 import UpdateSessionLauncherModal from "../components/SessionModals/UpdateSessionLauncherModal";
@@ -65,7 +67,7 @@ import {
   SessionStatusV2Title,
 } from "../components/SessionStatus/SessionStatus";
 import { DEFAULT_URL } from "../session.constants";
-import { SessionLauncher, SessionV2 } from "../sessionsV2.types";
+import { SessionV2 } from "../sessionsV2.types";
 import { EnvironmentCard } from "./EnvironmentCard";
 
 interface SessionCardContentProps {

client/src/features/sessionsV2/SessionsV2.tsx

@@ -43,10 +43,11 @@ import DeleteSessionV2Modal from "./DeleteSessionLauncherModal";
 import SessionItem from "./SessionList/SessionItem";
 import { SessionItemDisplay } from "./SessionList/SessionItemDisplay";
 import { SessionView } from "./SessionView/SessionView";
+import type { SessionLauncher } from "./api/sessionLaunchersV2.api";
 import { useGetProjectsByProjectIdSessionLaunchersQuery as useGetProjectSessionLaunchersQuery } from "./api/sessionLaunchersV2.api";
 import { useGetSessionsQuery as useGetSessionsQueryV2 } from "./api/sessionsV2.api";
 import UpdateSessionLauncherModal from "./components/SessionModals/UpdateSessionLauncherModal";
-import { SessionLauncher, SessionV2 } from "./sessionsV2.types";
+import { SessionV2 } from "./sessionsV2.types";
 
 // Required for logs formatting
 import "../../notebooks/Notebooks.css";