From 4ecb29592ea816b65272a04512a896cee5eff0df Mon Sep 17 00:00:00 2001
From: Stanislas Lange <stanislas.lange@pm.me>
Date: Wed, 28 Jul 2021 19:55:36 +0000
Subject: [PATCH] feat(bench): add maxCyclomaticComplexity

---
 src/components/Benchmarks/BenchmarkDetail.tsx | 15 +++++++-------
 src/components/Benchmarks/BenchmarkModel.ts   |  1 +
 src/components/Benchmarks/CreateBenchmark.tsx | 20 ++++++++++++++++++-
 src/components/Benchmarks/Result.tsx          | 13 +++++++++++-
 src/hooks/benchmark.ts                        |  1 +
 5 files changed, 41 insertions(+), 9 deletions(-)

diff --git a/src/components/Benchmarks/BenchmarkDetail.tsx b/src/components/Benchmarks/BenchmarkDetail.tsx
index 883e607..acc1e64 100644
--- a/src/components/Benchmarks/BenchmarkDetail.tsx
+++ b/src/components/Benchmarks/BenchmarkDetail.tsx
@@ -42,6 +42,13 @@ const BenchmarkDetail = ({
     editorRef.current = editor;
   }
 
+  const {
+    isLoading: isBenchmarkLoading,
+    isError: isBenchmarkError,
+    data: benchmarkData,
+    error,
+  } = useBenchmarkDetail(match.params.id);
+
   let lastSubmission;
   const {
     isLoading: isLastSubmissionLoading,
@@ -89,17 +96,11 @@ const BenchmarkDetail = ({
         lintScore={jobData.lintScore}
         lintErrors={jobData.lintErrors}
         isLoading={isProcessing}
+        maxCyclomaticComplexity={benchmarkData?.maxCyclomaticComplexity}
       />
     );
   }
 
-  const {
-    isLoading: isBenchmarkLoading,
-    isError: isBenchmarkError,
-    data: benchmarkData,
-    error,
-  } = useBenchmarkDetail(match.params.id);
-
   if (isBenchmarkLoading) {
     return <span>Loading....</span>;
   }
diff --git a/src/components/Benchmarks/BenchmarkModel.ts b/src/components/Benchmarks/BenchmarkModel.ts
index 8bf42aa..51aae5f 100644
--- a/src/components/Benchmarks/BenchmarkModel.ts
+++ b/src/components/Benchmarks/BenchmarkModel.ts
@@ -5,6 +5,7 @@ export default class benchmarkModel {
   gitUrl: null | undefined;
   createdAt: string | undefined;
   difficulty: string | undefined;
+  maxCyclomaticComplexity: number | undefined;
   creator:
     | {
         id: string | undefined;
diff --git a/src/components/Benchmarks/CreateBenchmark.tsx b/src/components/Benchmarks/CreateBenchmark.tsx
index c08426e..64a6040 100644
--- a/src/components/Benchmarks/CreateBenchmark.tsx
+++ b/src/components/Benchmarks/CreateBenchmark.tsx
@@ -29,6 +29,7 @@ const CreateBenchmark: React.FC = () => {
     const title = event.target.title.value;
     const subject = event.target.subject.value;
     const difficulty = event.target.difficulty.value;
+    const maxCyclomaticComplexity = event.target.maxCylomaticComplexity.value;
 
     if (title === '' || subject === '') {
       setMessage('At least one field is blank');
@@ -36,7 +37,7 @@ const CreateBenchmark: React.FC = () => {
       return;
     }
 
-    mutate({ title, subject, difficulty });
+    mutate({ title, subject, difficulty, maxCyclomaticComplexity });
   };
 
   return (
@@ -75,6 +76,23 @@ const CreateBenchmark: React.FC = () => {
               />
             </div>
           </div>
+          <div className="flex flex-wrap -mx-3 mb-6">
+            <div className="w-full px-3">
+              <label
+                className="block dark:text-gray-100 uppercase tracking-wide text-gray-700 text-xs font-bold mb-2"
+                htmlFor="grid-password"
+              >
+                Max cyclomatic complexity
+              </label>
+              <input
+                className="block appearance-none w-full bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
+                type="number"
+                id="maxCylomaticComplexity"
+                min="1"
+                max="10"
+              />
+            </div>
+          </div>
           <div className="flex flex-wrap -mx-3 mb-6">
             <div className="w-full px-3">
               <label
diff --git a/src/components/Benchmarks/Result.tsx b/src/components/Benchmarks/Result.tsx
index 90c9fc3..3d5a656 100644
--- a/src/components/Benchmarks/Result.tsx
+++ b/src/components/Benchmarks/Result.tsx
@@ -14,6 +14,7 @@ interface LayoutProps {
   lintScore?: number;
   lintErrors?: LintErrorDTO[];
   isLoading: boolean;
+  maxCyclomaticComplexity?: number;
 }
 
 const Result: React.FC<LayoutProps> = ({
@@ -29,6 +30,7 @@ const Result: React.FC<LayoutProps> = ({
   lintErrors,
   isLoading,
   cyclomaticComplexity,
+  maxCyclomaticComplexity,
 }) => {
   if (status !== 'done' && status !== 'failed') {
     return (
@@ -53,6 +55,7 @@ const Result: React.FC<LayoutProps> = ({
             memUsage={memUsage}
             execDuration={execDuration}
             cyclomaticComplexity={cyclomaticComplexity}
+            maxCyclomaticComplexity={maxCyclomaticComplexity}
           />
         </div>
         <div className="w-3/5 pl-6">
@@ -139,6 +142,7 @@ interface ScoresComponentProps {
   memUsage: number | undefined;
   execDuration: number | undefined;
   cyclomaticComplexity: number | undefined;
+  maxCyclomaticComplexity: number | undefined;
 }
 
 const ScoresComponent: React.FC<ScoresComponentProps> = ({
@@ -148,6 +152,7 @@ const ScoresComponent: React.FC<ScoresComponentProps> = ({
   memUsage,
   execDuration,
   cyclomaticComplexity,
+  maxCyclomaticComplexity,
 }) => {
   return (
     <div className="relative flex flex-col min-w-0 mb-4 lg:mb-0 break-words bg-gray-50 dark:bg-gray-800 w-full shadow-lg rounded">
@@ -236,7 +241,13 @@ const ScoresComponent: React.FC<ScoresComponentProps> = ({
                 </th>
                 <td className="border-t-0 px-4 align-middle border-l-0 border-r-0 text-sm whitespace-nowrap p-3">
                   <div className="flex items-center">
-                    <span className="mr-2">{cyclomaticComplexity}</span>
+                    <span className="mr-2">
+                      {cyclomaticComplexity} / {maxCyclomaticComplexity}{' '}
+                      {(cyclomaticComplexity ?? 0) >
+                      (maxCyclomaticComplexity ?? 0)
+                        ? '❌'
+                        : '✅'}
+                    </span>
                   </div>
                 </td>
               </tr>
diff --git a/src/hooks/benchmark.ts b/src/hooks/benchmark.ts
index 6a8cdd2..0aaa428 100644
--- a/src/hooks/benchmark.ts
+++ b/src/hooks/benchmark.ts
@@ -26,6 +26,7 @@ export async function createBenchmark(bench: {
   title: string;
   subject: string;
   difficulty: string;
+  maxCyclomaticComplexity: number;
 }): Promise<benchmarkModel> {
   const { data } = await authenticatedRequest({
     url: `/benchmarks`,