feat :: stage log 조회

src/pages/Team/deploy/Container/HistoryLog.tsx

@@ -0,0 +1,81 @@
+import { theme } from '@/style/theme';
+import { getStageLog } from '@/utils/apis/container';
+import styled from '@emotion/styled';
+import { useEffect, useState } from 'react';
+import { useParams } from 'react-router-dom';
+
+export const TeamDeployContainerHistoryLog = () => {
+  const { pipelineName, pipelineCounter, stageName } = useParams();
+  const [data, setData] = useState<string>();
+
+  useEffect(() => {
+    if (pipelineName && pipelineCounter && stageName) {
+      getStageLog(pipelineName, pipelineCounter, stageName).then((res) => {
+        setData(res.data);
+      });
+    }
+  }, [pipelineName, pipelineCounter, stageName]);
+
+  return (
+    <Wrapper>
+      <TitleContainer>
+        <TeamName>stage</TeamName>
+        {stageName && <Title>{stageName}</Title>}
+      </TitleContainer>
+      {data && (
+        <BuildLog>
+          {data.split('\n').map((ele, idx) => {
+            return <div key={idx}>{ele}</div>;
+          })}
+        </BuildLog>
+      )}
+    </Wrapper>
+  );
+};
+
+const Wrapper = styled.div`
+  width: 100%;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 30px;
+`;
+
+const TitleContainer = styled.div`
+  width: 100%;
+  max-width: 1120px;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+`;
+
+const TeamName = styled.div`
+  font-size: 20px;
+  font-weight: 500;
+  color: ${theme.color.gray5};
+`;
+
+const Title = styled.div`
+  font-size: 30px;
+  font-weight: 600;
+  color: ${theme.color.gray8};
+  display: flex;
+  align-items: center;
+  gap: 14px;
+`;
+
+const BuildLog = styled.div`
+  width: 100%;
+  max-width: 1120px;
+  height: 100%;
+  background-color: #333333;
+  border-radius: 8px;
+  padding: 30px;
+  > div {
+    word-wrap: break-word;
+    font-family: 'JetBrains Mono';
+    font-weight: 600;
+    font-size: 12px;
+    color: ${theme.color.gray1};
+  }
+`;

src/utils/apis/container.ts

@@ -1,20 +1,65 @@
-import { ContainerEnvType } from '../types/containerType';
+import { ConfigPostType, ContainerEnvType } from '../types/containerType';
 import { instance } from './axios';
 
-const router = 'v1/container';
+const v1Router = 'v1/container';
+const v2Router = 'v2/container';
 
 export const getAllContainer = async (deployUUID: string) => {
-  return await instance.get(`${router}?deployId=${deployUUID}`);
+  return await instance.get(`${v1Router}?deployId=${deployUUID}`);
 };
 
 export const getDetailContainer = async (deployUUID: string, env: string) => {
-  return await instance.get(`${router}/details?deployId=${deployUUID}&environment=${env}`);
+  return await instance.get(`${v1Router}/details?deployId=${deployUUID}&environment=${env}`);
 };
 
-export const getCPU = async (deployUUID: string, env: ContainerEnvType) => {
-  return await instance.get(`${router}/cpu?deployId=${deployUUID}&environment=${env}`);
+export const getCPU = async (deployUUID: string, env: string) => {
+  return await instance.get(`${v1Router}/cpu?deployId=${deployUUID}&environment=${env}`);
 };
 
-export const getMemory = async (deployUUID: string, env: ContainerEnvType) => {
-  return await instance.get(`${router}/memory?deployId=${deployUUID}&environment=${env}`);
+export const getMemory = async (deployUUID: string, env: string) => {
+  return await instance.get(`${v1Router}/memory?deployId=${deployUUID}&environment=${env}`);
+};
+
+export const writeContainerConfig = async (deployUUID: string, data: ConfigPostType) => {
+  return await instance.post(`${v2Router}/config?deployId=${deployUUID}`, data);
+};
+
+export const writeContainerGradle = async (
+  deployUUID: string,
+  env: string,
+  data: {
+    jdk_version: string;
+    output_dir: string;
+    build_commands: string[];
+  },
+) => {
+  return await instance.post(`${v2Router}/gradle?deployId=${deployUUID}&environment=${env}`, data);
+};
+
+export const writeContainerNode = async (
+  deployUUID: string,
+  env: string,
+  data: {
+    node_version: string;
+    command: string;
+    build_commands: string[];
+  },
+) => {
+  return await instance.post(`${v2Router}/gradle?deployId=${deployUUID}&environment=${env}`, data);
+};
+
+export const writeContainerNginx = async (
+  deployUUID: string,
+  env: string,
+  data: {
+    node_version: string;
+    output_dir: string;
+    build_commands: string[];
+  },
+) => {
+  return await instance.post(`${v2Router}/gradle?deployId=${deployUUID}&environment=${env}`, data);
+};
+
+export const getStageLog = async (pipelineName: string, pipelineCounter: string, stageName: string) => {
+  return await instance.get(`${v2Router}/${pipelineName}/${pipelineCounter}/stage/${stageName}`);
 };

src/utils/types/containerType.ts

@@ -21,3 +21,11 @@ export type ContainerDetailType = {
   container_name: string;
   is_v2: boolean;
 };
+
+type ConfigType = {
+  branch: string;
+  container_port: string;
+  domain: string;
+};
+
+export type ConfigPostType = { stag: ConfigType; prod: ConfigType; language: string };

src/utils/types/historyType.ts

@@ -9,4 +9,6 @@ export type HistoryType = {
   scheduled_date: number;
   commit_message: string;
   stages: StageType[];
+  pipeline_name: string;
+  pipeline_counter: number;
 };