Added delete work flow for error. Fixed side-by-side toggle. Reverted… (#189)

- Reverted colors of squares in property inspector

![image](https://github.com/user-attachments/assets/87dd64b1-4ac5-440f-9765-bf59c1bb02bb)

- Fixed job error and re-run logic
- Fixed side-by-side toggle not present in the property comparison table

![image](https://github.com/user-attachments/assets/61d8d41e-e433-4e8c-8e79-186fdcfedca3)

Author: CalebGerman

.changeset/many-spies-attend.md

@@ -0,0 +1,7 @@
+---
+"@itwin/changed-elements-react": patch
+---
+
+- Reverted colors of squares in property inspector
+- Fixed job error and re-run logic
+- Fixed side-by-side toggle not present in property comparison table

packages/changed-elements-react/src/NamedVersionSelector/useComparisonJobs.ts

@@ -174,36 +174,46 @@ interface PostOrGetComparisonJobParams {
 async function postOrGetComparisonJob(args: PostOrGetComparisonJobParams): Promise<ComparisonJob> {
   const numRetries = 3;
   const delayInMilliseconds = 5000;
-
   const { comparisonJobClient, iTwinId, iModelId, startChangesetId, endChangesetId, signal } = args;
+  const jobId = `${startChangesetId}-${endChangesetId}`;
   signal?.throwIfAborted();
 
-  const response = await tryXTimes(
-    async () => getComparisonJob({
-      comparisonJobClient,
-      iTwinId,
-      iModelId,
-      jobId: `${startChangesetId}-${endChangesetId}`,
-      signal,
-    }),
-    numRetries,
-    delayInMilliseconds,
-    signal,
-  );
+  const runGetDeletePostJobWorkflow = async () => {
+    const response = await getComparisonJob({
+        comparisonJobClient,
+        iTwinId,
+        iModelId,
+        jobId: jobId,
+        signal,
+      })
 
-  return response ?? tryXTimes(
-    () => comparisonJobClient.postComparisonJob({
-      iTwinId,
-      iModelId,
-      startChangesetId: startChangesetId,
-      endChangesetId: endChangesetId,
-      headers: { "Content-Type": "application/json" },
-      signal,
-    }),
-    numRetries,
-    delayInMilliseconds,
-    signal,
-  );
+    if (response?.comparisonJob?.status === "Failed") {
+      await args.comparisonJobClient.deleteComparisonJob({
+        iTwinId: iTwinId,
+        iModelId: iModelId,
+        jobId: jobId,
+      });
+      return comparisonJobClient.postComparisonJob({
+        iTwinId,
+        iModelId,
+        startChangesetId: startChangesetId,
+        endChangesetId: endChangesetId,
+        headers: { "Content-Type": "application/json" },
+        signal,
+      });
+    }
+
+    return response ??
+      comparisonJobClient.postComparisonJob({
+        iTwinId,
+        iModelId,
+        startChangesetId: startChangesetId,
+        endChangesetId: endChangesetId,
+        headers: { "Content-Type": "application/json" },
+        signal,
+      });
+  };
+  return tryXTimes(() => runGetDeletePostJobWorkflow(), numRetries, delayInMilliseconds, signal);
 }
 
 interface GetComparisonJobArgs {

packages/changed-elements-react/src/contentviews/PropertyComparisonTable.tsx

@@ -96,7 +96,7 @@ export function PropertyComparisonTable(props: PropertyComparisonTableProps): Re
         }
         <div className="settings">
           {
-            displaySideBySideToggle &&
+            (displaySideBySideToggle ?? true) &&
             <SideBySideToggle
               manager={manager}
               selection={selection}

packages/changed-elements-react/src/widgets/ChangedElementsInspector.scss

@@ -284,15 +284,15 @@
 }
 
 .added {
-  color: var(--iui-color-background-positive-hover);
+  color: RGB(86, 170, 28);
 }
 
 .modified {
-  color: var(--iui-color-background-informational-hover);
+  color: RGB(0, 139, 225);
 }
 
 .deleted {
-  color: var(--iui-color-background-negative-hover);
+  color: RGB(204, 0, 0);
 }
 
 .unchanged {
@@ -307,8 +307,8 @@
 
   &-modified {
     @extend .change-square;
-    background-color: var(--iui-color-background-informational-hover);
-    border-color: var(--iui-color-background-informational-hover);
+    background-color: RGB(0, 139, 225);
+    border-color:  RGB(0, 139, 225);
   }
 
   &-indirect {
@@ -318,14 +318,14 @@
 
   &-added {
     @extend .change-square;
-    background-color: var(--iui-color-background-positive-hover);
-    border-color: var(--iui-color-background-positive-hover);
+    background-color: RGB(86, 170, 28);
+    border-color:  RGB(86, 170, 28);
   }
 
   &-deleted {
     @extend .change-square;
-    background-color: var(--iui-color-background-negative-hover);
-    border-color: var(--iui-color-background-negative-hover);
+    background-color: RGB(204, 0, 0);
+    border-color: RGB(204, 0, 0);
   }
 }