From 0f0f2c1b8117ad36e64b6340dcd17d27e2a30119 Mon Sep 17 00:00:00 2001
From: Simon Larsen <simonlarsen@oneuptime.com>
Date: Sun, 14 Jul 2024 15:40:10 -0600
Subject: [PATCH] feat: Update react-syntax-highlighter to latest version and
 use a11yDark style

This commit updates the react-syntax-highlighter package to the latest version and switches to the a11yDark style for syntax highlighting in the MarkdownViewer component. This update ensures compatibility with the latest features and improvements of react-syntax-highlighter and enhances the accessibility of the code snippets in the MarkdownViewer.
---
 .../Markdown.tsx/MarkdownViewer.tsx           | 24 +++++++++++--------
 Copilot/Init.ts                               |  2 +-
 Copilot/Utils/CodeRepository.ts               | 20 ++++++++++++----
 .../CodeRepository/PullRequestView.tsx        |  7 ++++--
 .../src/Components/Copilot/LastRunMessage.tsx |  2 +-
 docker-compose.base.yml                       |  1 +
 docker-compose.dev.yml                        |  2 --
 7 files changed, 37 insertions(+), 21 deletions(-)

diff --git a/CommonUI/src/Components/Markdown.tsx/MarkdownViewer.tsx b/CommonUI/src/Components/Markdown.tsx/MarkdownViewer.tsx
index 8139fa660c..e851d4c480 100644
--- a/CommonUI/src/Components/Markdown.tsx/MarkdownViewer.tsx
+++ b/CommonUI/src/Components/Markdown.tsx/MarkdownViewer.tsx
@@ -3,9 +3,8 @@ import React, { FunctionComponent, ReactElement } from "react";
 import ReactMarkdown from "react-markdown";
 // https://github.com/remarkjs/remark-gfm
 import remarkGfm from "remark-gfm";
-import {Prism as SyntaxHighlighter} from 'react-syntax-highlighter'
-import {dark} from 'react-syntax-highlighter/dist/esm/styles/prism'
-
+import { Prism as SyntaxHighlighter } from "react-syntax-highlighter";
+import { a11yDark } from "react-syntax-highlighter/dist/esm/styles/prism";
 
 export interface ComponentProps {
   text: string;
@@ -78,23 +77,28 @@ const MarkdownViewer: FunctionComponent<ComponentProps> = (
           ul: ({ ...props }: any) => {
             return <ul className="list-disc px-6 m-1" {...props} />;
           },
-          code: (props) => {
-            const {children, className, node, ...rest} = props
-            const match = /language-(\w+)/.exec(className || '')
+          code: (props: any) => {
+            const { children, className, ...rest } = props;
+            const match: RegExpExecArray | null = /language-(\w+)/.exec(
+              className || "",
+            );
+
+            const content: string = String(children).replace(/\n$/, ""); 
+
             return match ? (
               <SyntaxHighlighter
                 {...rest}
                 PreTag="div"
-                children={String(children).replace(/\n$/, '')}
+                children={content}
                 language={match[1]}
-                style={dark}
+                style={a11yDark}
               />
             ) : (
               <code {...rest} className={className}>
                 {children}
               </code>
-            )
-          }
+            );
+          },
         }}
         remarkPlugins={[remarkGfm]}
       >
diff --git a/Copilot/Init.ts b/Copilot/Init.ts
index 1b46b02f63..0425b306de 100644
--- a/Copilot/Init.ts
+++ b/Copilot/Init.ts
@@ -347,7 +347,7 @@ const setUpRepository: PromiseVoidFunction = async (): Promise<void> => {
 
   logger.info(
     "Repository setup PR created - #" +
-      pullRequest.pullRequestId +
+      pullRequest.pullRequestNumber +
       ". Please megre this PR to continue using Copilot. Exiting..",
   );
 
diff --git a/Copilot/Utils/CodeRepository.ts b/Copilot/Utils/CodeRepository.ts
index 4abbf128d3..bd4cd763b1 100644
--- a/Copilot/Utils/CodeRepository.ts
+++ b/Copilot/Utils/CodeRepository.ts
@@ -102,12 +102,14 @@ export default class CodeRepositoryUtil {
       throw new BadDataException("Repository Name is required");
     }
 
-    if (!this.gitHubUtil) {
+    const githubUtil: GitHubUtil = this.getGitHubUtil();
+
+    if (!githubUtil) {
       throw new BadDataException("GitHub Util is required");
     }
 
     const pullRequest: PullRequest | undefined =
-      await this.gitHubUtil.getPullRequestByNumber({
+      await githubUtil.getPullRequestByNumber({
         organizationName:
           this.codeRepositoryResult.codeRepository.organizationName,
         repositoryName: this.codeRepositoryResult.codeRepository.repositoryName,
@@ -135,7 +137,9 @@ export default class CodeRepositoryUtil {
       "/usr/src/app/Templates/.oneuptime",
     );
 
-    const repoPath: string = this.getLocalRepositoryPath();
+    const oneUptimeConfigPath: string = LocalFile.sanitizeFilePath(
+      this.getLocalRepositoryPath() + "/.oneuptime",
+    );
 
     // create a new branch called oneuptime-copilot-setup
 
@@ -145,9 +149,11 @@ export default class CodeRepositoryUtil {
       branchName: branchName,
     });
 
+    await LocalFile.makeDirectory(oneUptimeConfigPath);
+
     await LocalFile.copyDirectory({
       source: templateFolderPath,
-      destination: repoPath,
+      destination: oneUptimeConfigPath,
     });
 
     // add all the files to the git.
@@ -277,7 +283,11 @@ export default class CodeRepositoryUtil {
   }
 
   public static async executeScript(data: { script: string }): Promise<string> {
-    const commands: Array<string> = data.script.split("\n");
+    const commands: Array<string> = data.script
+      .split("\n")
+      .filter((command: string) => {
+        return command.trim() !== "" && !command.startsWith("#");
+      });
 
     const results: Array<string> = [];
 
diff --git a/Dashboard/src/Components/CodeRepository/PullRequestView.tsx b/Dashboard/src/Components/CodeRepository/PullRequestView.tsx
index 15953e42f3..d3d99e171d 100644
--- a/Dashboard/src/Components/CodeRepository/PullRequestView.tsx
+++ b/Dashboard/src/Components/CodeRepository/PullRequestView.tsx
@@ -18,8 +18,11 @@ const PullRequestViewElement: FunctionComponent<ComponentProps> = (
       `https://github.com/${props.organizationName}/${props.repositoryName}/pull/${props.pullRequestId}`,
     );
     return (
-      <Link to={to} openInNewTab={true}>
-        {props.pullRequestId}
+      <Link to={to} className="hover:underline" openInNewTab={true}>
+        <>
+          <span>#</span>
+          {props.pullRequestId}
+        </>
       </Link>
     );
   }
diff --git a/Dashboard/src/Components/Copilot/LastRunMessage.tsx b/Dashboard/src/Components/Copilot/LastRunMessage.tsx
index 7187db82a4..570b7551d8 100644
--- a/Dashboard/src/Components/Copilot/LastRunMessage.tsx
+++ b/Dashboard/src/Components/Copilot/LastRunMessage.tsx
@@ -19,7 +19,7 @@ const CopilotLastRunAt: FunctionComponent<ComponentProps> = (
       {props.lastRunAt && (
         <Alert
           type={AlertType.INFO}
-          strongTitle="Last Run At: "
+          strongTitle="Copilot Last Ran At"
           title={`${OneUptimeDate.getDateAsLocalFormattedString(props.lastRunAt)}.`}
         />
       )}
diff --git a/docker-compose.base.yml b/docker-compose.base.yml
index 61fea3dc7e..eefd9c1989 100644
--- a/docker-compose.base.yml
+++ b/docker-compose.base.yml
@@ -378,6 +378,7 @@ services:
             ONEUPTIME_LLM_SERVER_URL: ${COPILOT_ONEUPTIME_LLM_SERVER_URL}
             DISABLE_COPILOT: ${DISABLE_COPILOT}
             OPENAI_API_KEY: ${COPILOT_OPENAI_API_KEY}
+            LOG_LEVEL: ${LOG_LEVEL}
         logging:
             driver: "local"
             options:
diff --git a/docker-compose.dev.yml b/docker-compose.dev.yml
index ea3d8560e1..432c67bb69 100644
--- a/docker-compose.dev.yml
+++ b/docker-compose.dev.yml
@@ -356,8 +356,6 @@ services:
         extends:
             file: ./docker-compose.base.yml
             service: copilot
-        environment:
-            - LOG_LEVEL=INFO
         build:
             network: host
             context: .