From a0a96643155495f21eca4e803f14c3567bb8904e Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Mon, 29 Jun 2020 18:09:32 -0300
Subject: [PATCH 1/9] fix: ui tweaks

---
 .../plugin/components/Comments/Comments.tsx   |   2 +-
 .../__snapshots__/Comments.test.tsx.snap      |  16 +--
 .../__snapshots__/PluginHeader.test.tsx.snap  |  82 +++++++++----
 .../components/PluginSpecs/PluginSpecs.tsx    |  26 +++--
 .../__snapshots__/PluginSpecs.test.tsx.snap   |  41 +++++--
 .../pages/PluginDetails/PluginDetails.tsx     |   2 +-
 .../__snapshots__/PluginDetails.test.tsx.snap | 110 ++++++++++++------
 7 files changed, 188 insertions(+), 91 deletions(-)

diff --git a/src/domains/plugin/components/Comments/Comments.tsx b/src/domains/plugin/components/Comments/Comments.tsx
index 269fdfade3..844701b1bb 100644
--- a/src/domains/plugin/components/Comments/Comments.tsx
+++ b/src/domains/plugin/components/Comments/Comments.tsx
@@ -43,7 +43,7 @@ export const Comments = ({ comments, sortOptions }: CommentsProps) => {
 
 	return (
 		<div className="w-full">
-			<p className="text-xl font-bold">Reviews ARK Explorer</p>
+			<p className="text-2xl font-bold">Reviews ARK Explorer</p>
 			<div className="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900">
 				<span>Sort by:</span>
 				<div className="flex items-center">
diff --git a/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap b/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap
index a302f33fd3..81aa2d74ab 100644
--- a/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap
+++ b/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap
@@ -6,7 +6,7 @@ exports[`Comments should handle sortBy properly 1`] = `
     class="w-full"
   >
     <p
-      class="text-xl font-bold"
+      class="text-2xl font-bold"
     >
       Reviews ARK Explorer
     </p>
@@ -89,7 +89,7 @@ exports[`Comments should handle sortBy properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                3 days ago
+                10 days ago
               </span>
             </div>
           </div>
@@ -144,7 +144,7 @@ exports[`Comments should handle sortBy properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                3 days ago
+                10 days ago
               </span>
             </div>
           </div>
@@ -183,7 +183,7 @@ exports[`Comments should handle sortBy properly 1`] = `
                 <span
                   class="px-3"
                 >
-                  3 days ago
+                  10 days ago
                 </span>
               </div>
             </div>
@@ -308,7 +308,7 @@ exports[`Comments should render properly 1`] = `
     class="w-full"
   >
     <p
-      class="text-xl font-bold"
+      class="text-2xl font-bold"
     >
       Reviews ARK Explorer
     </p>
@@ -391,7 +391,7 @@ exports[`Comments should render properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                3 days ago
+                10 days ago
               </span>
             </div>
           </div>
@@ -446,7 +446,7 @@ exports[`Comments should render properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                3 days ago
+                10 days ago
               </span>
             </div>
           </div>
@@ -485,7 +485,7 @@ exports[`Comments should render properly 1`] = `
                 <span
                   class="px-3"
                 >
-                  3 days ago
+                  10 days ago
                 </span>
               </div>
             </div>
diff --git a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
index 15e3570a38..2aa50c8831 100644
--- a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
+++ b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
@@ -95,7 +95,7 @@ exports[`PluginHeader should render as installed 1`] = `
           </div>
         </div>
         <div
-          class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral"
+          class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300"
         >
           <div
             class="flex"
@@ -116,7 +116,7 @@ exports[`PluginHeader should render as installed 1`] = `
             </div>
           </div>
           <div
-            class="flex px-8"
+            class="flex px-6"
           >
             <div
               class="flex flex-col undefined"
@@ -134,10 +134,10 @@ exports[`PluginHeader should render as installed 1`] = `
             </div>
           </div>
           <div
-            class="flex px-8"
+            class="flex px-6 -ml-5"
           >
             <div
-              class="flex flex-col undefined"
+              class="flex flex-col"
             >
               <span
                 class="font-bold text-theme-neutral-400"
@@ -145,28 +145,45 @@ exports[`PluginHeader should render as installed 1`] = `
                 URL
               </span>
               <span
-                class="font-bold text-theme-neutral-600"
+                class="font-bold text-theme-primary"
               >
                 github.com
               </span>
             </div>
           </div>
           <div
-            class="flex col-span-2 justify-between px-8"
+            class="flex col-span-2 justify-between px-6 -ml-8"
           >
             <div
-              class="flex flex-col undefined"
+              class="flex flex-col"
             >
               <span
                 class="font-bold text-theme-neutral-400"
               >
                 Rating
               </span>
-              <span
-                class="font-bold text-theme-neutral-600"
+              <div
+                class="flex items-center"
               >
-                4.6
-              </span>
+                <div
+                  class="pr-1 text-theme-warning-300"
+                >
+                  <div
+                    class="sc-AxirZ iQaTP"
+                    height="1em"
+                    width="1em"
+                  >
+                    <svg>
+                      star.svg
+                    </svg>
+                  </div>
+                </div>
+                <span
+                  class="font-bold text-theme-neutral-600"
+                >
+                  4.6
+                </span>
+              </div>
             </div>
             <div
               class="flex flex-col text-right"
@@ -184,7 +201,7 @@ exports[`PluginHeader should render as installed 1`] = `
             </div>
           </div>
           <div
-            class="flex pl-8"
+            class="flex pl-6"
           >
             <div
               class="flex flex-col text-right"
@@ -271,7 +288,7 @@ exports[`PluginHeader should render properly 1`] = `
           </div>
         </div>
         <div
-          class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral"
+          class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300"
         >
           <div
             class="flex"
@@ -292,7 +309,7 @@ exports[`PluginHeader should render properly 1`] = `
             </div>
           </div>
           <div
-            class="flex px-8"
+            class="flex px-6"
           >
             <div
               class="flex flex-col undefined"
@@ -310,10 +327,10 @@ exports[`PluginHeader should render properly 1`] = `
             </div>
           </div>
           <div
-            class="flex px-8"
+            class="flex px-6 -ml-5"
           >
             <div
-              class="flex flex-col undefined"
+              class="flex flex-col"
             >
               <span
                 class="font-bold text-theme-neutral-400"
@@ -321,28 +338,45 @@ exports[`PluginHeader should render properly 1`] = `
                 URL
               </span>
               <span
-                class="font-bold text-theme-neutral-600"
+                class="font-bold text-theme-primary"
               >
                 github.com
               </span>
             </div>
           </div>
           <div
-            class="flex col-span-2 justify-between px-8"
+            class="flex col-span-2 justify-between px-6 -ml-8"
           >
             <div
-              class="flex flex-col undefined"
+              class="flex flex-col"
             >
               <span
                 class="font-bold text-theme-neutral-400"
               >
                 Rating
               </span>
-              <span
-                class="font-bold text-theme-neutral-600"
+              <div
+                class="flex items-center"
               >
-                4.6
-              </span>
+                <div
+                  class="pr-1 text-theme-warning-300"
+                >
+                  <div
+                    class="sc-AxirZ iQaTP"
+                    height="1em"
+                    width="1em"
+                  >
+                    <svg>
+                      star.svg
+                    </svg>
+                  </div>
+                </div>
+                <span
+                  class="font-bold text-theme-neutral-600"
+                >
+                  4.6
+                </span>
+              </div>
             </div>
             <div
               class="flex flex-col text-right"
@@ -360,7 +394,7 @@ exports[`PluginHeader should render properly 1`] = `
             </div>
           </div>
           <div
-            class="flex pl-8"
+            class="flex pl-6"
           >
             <div
               class="flex flex-col text-right"
diff --git a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
index 0be270e992..864a35ef59 100644
--- a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
+++ b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
@@ -1,3 +1,4 @@
+import { Icon } from "app/components/Icon";
 import React from "react";
 
 type Props = {
@@ -44,21 +45,32 @@ const GridCol = ({ children, colSpan, justify, padding }: GridColProps) => {
 };
 
 export const PluginSpecs = ({ author, category, url, rating, version, size }: Props) => (
-	<div className="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral">
+	<div className="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300">
 		<GridCol>
 			<GridItem label="Author" value={author} />
 		</GridCol>
-		<GridCol padding="px-8">
+		<GridCol padding="px-6">
 			<GridItem label="Category" value={category} />
 		</GridCol>
-		<GridCol padding="px-8">
-			<GridItem label="URL" value={url} />
+		<GridCol padding="px-6 -ml-5">
+			<div className="flex flex-col">
+				<span className="font-bold text-theme-neutral-400">URL</span>
+				<span className="font-bold text-theme-primary">{url}</span>
+			</div>
 		</GridCol>
-		<GridCol colSpan={2} justify="between" padding="px-8">
-			<GridItem label="Rating" value={rating} />
+		<GridCol colSpan={2} justify="between" padding="px-6 -ml-8">
+			<div className="flex flex-col">
+				<span className="font-bold text-theme-neutral-400">Rating</span>
+				<div className="flex items-center">
+					<div className="pr-1 text-theme-warning-300">
+						<Icon name="Star" />
+					</div>
+					<span className="font-bold text-theme-neutral-600">{rating}</span>
+				</div>
+			</div>
 			<GridItem label="Version" value={`v.${version}`} textDirection="right" />
 		</GridCol>
-		<GridCol padding="pl-8">
+		<GridCol padding="pl-6">
 			<GridItem label="Size" value={`${size} Mb`} textDirection="right" />
 		</GridCol>
 	</div>
diff --git a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
index 633d3a214b..8423b6c09f 100644
--- a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
+++ b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
@@ -3,7 +3,7 @@
 exports[`PluginSpecs should render properly 1`] = `
 <DocumentFragment>
   <div
-    class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral"
+    class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300"
   >
     <div
       class="flex"
@@ -24,7 +24,7 @@ exports[`PluginSpecs should render properly 1`] = `
       </div>
     </div>
     <div
-      class="flex px-8"
+      class="flex px-6"
     >
       <div
         class="flex flex-col undefined"
@@ -42,10 +42,10 @@ exports[`PluginSpecs should render properly 1`] = `
       </div>
     </div>
     <div
-      class="flex px-8"
+      class="flex px-6 -ml-5"
     >
       <div
-        class="flex flex-col undefined"
+        class="flex flex-col"
       >
         <span
           class="font-bold text-theme-neutral-400"
@@ -53,28 +53,45 @@ exports[`PluginSpecs should render properly 1`] = `
           URL
         </span>
         <span
-          class="font-bold text-theme-neutral-600"
+          class="font-bold text-theme-primary"
         >
           github.com
         </span>
       </div>
     </div>
     <div
-      class="flex col-span-2 justify-between px-8"
+      class="flex col-span-2 justify-between px-6 -ml-8"
     >
       <div
-        class="flex flex-col undefined"
+        class="flex flex-col"
       >
         <span
           class="font-bold text-theme-neutral-400"
         >
           Rating
         </span>
-        <span
-          class="font-bold text-theme-neutral-600"
+        <div
+          class="flex items-center"
         >
-          4.6
-        </span>
+          <div
+            class="pr-1 text-theme-warning-300"
+          >
+            <div
+              class="sc-AxjAm cpczEI"
+              height="1em"
+              width="1em"
+            >
+              <svg>
+                star.svg
+              </svg>
+            </div>
+          </div>
+          <span
+            class="font-bold text-theme-neutral-600"
+          >
+            4.6
+          </span>
+        </div>
       </div>
       <div
         class="flex flex-col text-right"
@@ -92,7 +109,7 @@ exports[`PluginSpecs should render properly 1`] = `
       </div>
     </div>
     <div
-      class="flex pl-8"
+      class="flex pl-6"
     >
       <div
         class="flex flex-col text-right"
diff --git a/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx b/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx
index a9418b106f..5f99d0fe08 100644
--- a/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx
+++ b/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx
@@ -31,7 +31,7 @@ export const PluginDetails = ({ pluginData, reviewData, isInstalled }: PluginDet
 			/>
 			<PluginInfo about={about} permissions={permissions} screenshots={screenshots} />
 			<div className="mt-5 bg-theme-background">
-				<div className="py-24 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300">
+				<div className="py-16 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300">
 					<div className="col-span-2" data-testid="plugin-details__comments">
 						<Comments comments={comments} sortOptions={commentsSortingOptions} />
 					</div>
diff --git a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
index eab46e94c6..75ea88ed06 100644
--- a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
+++ b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
@@ -67,7 +67,7 @@ exports[`PluginDetails should render properly 1`] = `
             </div>
           </div>
           <div
-            class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral"
+            class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300"
           >
             <div
               class="flex"
@@ -88,7 +88,7 @@ exports[`PluginDetails should render properly 1`] = `
               </div>
             </div>
             <div
-              class="flex px-8"
+              class="flex px-6"
             >
               <div
                 class="flex flex-col undefined"
@@ -106,10 +106,10 @@ exports[`PluginDetails should render properly 1`] = `
               </div>
             </div>
             <div
-              class="flex px-8"
+              class="flex px-6 -ml-5"
             >
               <div
-                class="flex flex-col undefined"
+                class="flex flex-col"
               >
                 <span
                   class="font-bold text-theme-neutral-400"
@@ -117,28 +117,45 @@ exports[`PluginDetails should render properly 1`] = `
                   URL
                 </span>
                 <span
-                  class="font-bold text-theme-neutral-600"
+                  class="font-bold text-theme-primary"
                 >
                   github.com
                 </span>
               </div>
             </div>
             <div
-              class="flex col-span-2 justify-between px-8"
+              class="flex col-span-2 justify-between px-6 -ml-8"
             >
               <div
-                class="flex flex-col undefined"
+                class="flex flex-col"
               >
                 <span
                   class="font-bold text-theme-neutral-400"
                 >
                   Rating
                 </span>
-                <span
-                  class="font-bold text-theme-neutral-600"
+                <div
+                  class="flex items-center"
                 >
-                  4.6
-                </span>
+                  <div
+                    class="pr-1 text-theme-warning-300"
+                  >
+                    <div
+                      class="sc-AxjAm cpczEI"
+                      height="1em"
+                      width="1em"
+                    >
+                      <svg>
+                        star.svg
+                      </svg>
+                    </div>
+                  </div>
+                  <span
+                    class="font-bold text-theme-neutral-600"
+                  >
+                    4.6
+                  </span>
+                </div>
               </div>
               <div
                 class="flex flex-col text-right"
@@ -156,7 +173,7 @@ exports[`PluginDetails should render properly 1`] = `
               </div>
             </div>
             <div
-              class="flex pl-8"
+              class="flex pl-6"
             >
               <div
                 class="flex flex-col text-right"
@@ -347,7 +364,7 @@ exports[`PluginDetails should render properly 1`] = `
       class="mt-5 bg-theme-background"
     >
       <div
-        class="py-24 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
+        class="py-16 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
       >
         <div
           class="col-span-2"
@@ -357,7 +374,7 @@ exports[`PluginDetails should render properly 1`] = `
             class="w-full"
           >
             <p
-              class="text-xl font-bold"
+              class="text-2xl font-bold"
             >
               Reviews ARK Explorer
             </p>
@@ -440,7 +457,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>
@@ -495,7 +512,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>
@@ -534,7 +551,7 @@ exports[`PluginDetails should render properly 1`] = `
                         <span
                           class="px-3"
                         >
-                          3 days ago
+                          10 days ago
                         </span>
                       </div>
                     </div>
@@ -591,7 +608,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>
@@ -646,7 +663,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>
@@ -1099,7 +1116,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
             </div>
           </div>
           <div
-            class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-gray-400 grid-flow-col border-theme-neutral"
+            class="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300"
           >
             <div
               class="flex"
@@ -1120,7 +1137,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
               </div>
             </div>
             <div
-              class="flex px-8"
+              class="flex px-6"
             >
               <div
                 class="flex flex-col undefined"
@@ -1138,10 +1155,10 @@ exports[`PluginDetails should render properly as installed 1`] = `
               </div>
             </div>
             <div
-              class="flex px-8"
+              class="flex px-6 -ml-5"
             >
               <div
-                class="flex flex-col undefined"
+                class="flex flex-col"
               >
                 <span
                   class="font-bold text-theme-neutral-400"
@@ -1149,28 +1166,45 @@ exports[`PluginDetails should render properly as installed 1`] = `
                   URL
                 </span>
                 <span
-                  class="font-bold text-theme-neutral-600"
+                  class="font-bold text-theme-primary"
                 >
                   github.com
                 </span>
               </div>
             </div>
             <div
-              class="flex col-span-2 justify-between px-8"
+              class="flex col-span-2 justify-between px-6 -ml-8"
             >
               <div
-                class="flex flex-col undefined"
+                class="flex flex-col"
               >
                 <span
                   class="font-bold text-theme-neutral-400"
                 >
                   Rating
                 </span>
-                <span
-                  class="font-bold text-theme-neutral-600"
+                <div
+                  class="flex items-center"
                 >
-                  4.6
-                </span>
+                  <div
+                    class="pr-1 text-theme-warning-300"
+                  >
+                    <div
+                      class="sc-AxjAm cpczEI"
+                      height="1em"
+                      width="1em"
+                    >
+                      <svg>
+                        star.svg
+                      </svg>
+                    </div>
+                  </div>
+                  <span
+                    class="font-bold text-theme-neutral-600"
+                  >
+                    4.6
+                  </span>
+                </div>
               </div>
               <div
                 class="flex flex-col text-right"
@@ -1188,7 +1222,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
               </div>
             </div>
             <div
-              class="flex pl-8"
+              class="flex pl-6"
             >
               <div
                 class="flex flex-col text-right"
@@ -1379,7 +1413,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
       class="mt-5 bg-theme-background"
     >
       <div
-        class="py-24 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
+        class="py-16 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
       >
         <div
           class="col-span-2"
@@ -1389,7 +1423,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
             class="w-full"
           >
             <p
-              class="text-xl font-bold"
+              class="text-2xl font-bold"
             >
               Reviews ARK Explorer
             </p>
@@ -1472,7 +1506,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>
@@ -1527,7 +1561,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>
@@ -1566,7 +1600,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                         <span
                           class="px-3"
                         >
-                          3 days ago
+                          10 days ago
                         </span>
                       </div>
                     </div>
@@ -1623,7 +1657,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>
@@ -1678,7 +1712,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        3 days ago
+                        10 days ago
                       </span>
                     </div>
                   </div>

From 789d239fce59f7db518ba4f98525f8fb2a791e75 Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Tue, 30 Jun 2020 08:21:57 -0300
Subject: [PATCH 2/9] feat(assets): add report and verified icons

---
 src/app/assets/svg/index.ts     | 4 ++++
 src/app/assets/svg/report.svg   | 3 +++
 src/app/assets/svg/verified.svg | 3 +++
 3 files changed, 10 insertions(+)
 create mode 100644 src/app/assets/svg/report.svg
 create mode 100644 src/app/assets/svg/verified.svg

diff --git a/src/app/assets/svg/index.ts b/src/app/assets/svg/index.ts
index aabfb71693..b4a55a043e 100644
--- a/src/app/assets/svg/index.ts
+++ b/src/app/assets/svg/index.ts
@@ -71,6 +71,7 @@ import { ReactComponent as Reddit } from "./reddit.svg";
 import { ReactComponent as Redirect } from "./redirect.svg";
 import { ReactComponent as RegistrationsIllustration } from "./register.svg";
 import { ReactComponent as ReplyArrow } from "./reply-arrow.svg";
+import { ReactComponent as Report } from "./report.svg";
 import { ReactComponent as Reset } from "./reset.svg";
 import { ReactComponent as Search } from "./search.svg";
 import { ReactComponent as Send } from "./send.svg";
@@ -87,6 +88,7 @@ import { ReactComponent as Twitter } from "./twitter.svg";
 import { ReactComponent as Update } from "./update.svg";
 import { ReactComponent as Upload } from "./upload.svg";
 import { ReactComponent as User } from "./user.svg";
+import { ReactComponent as Verified } from "./verified.svg";
 import { ReactComponent as Voted } from "./voted.svg";
 
 export const SvgCollection: any = {
@@ -153,6 +155,7 @@ export const SvgCollection: any = {
 	Redirect,
 	RegistrationsIllustration,
 	ReplyArrow,
+	Report,
 	Reset,
 	Search,
 	Send,
@@ -169,6 +172,7 @@ export const SvgCollection: any = {
 	Update,
 	Upload,
 	Voted,
+	Verified,
 	Notification,
 	User,
 	Exchange,
diff --git a/src/app/assets/svg/report.svg b/src/app/assets/svg/report.svg
new file mode 100644
index 0000000000..d38e31d3cc
--- /dev/null
+++ b/src/app/assets/svg/report.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
+  <path id="Прямоугольник_скругл._углы_970" data-name="Прямоугольник, скругл. углы 970" d="M0,10A10,10,0,1,1,10,20,10.011,10.011,0,0,1,0,10Zm2,0a8,8,0,1,0,8-8A8.01,8.01,0,0,0,2,10Zm7,4a1,1,0,1,1,1,1A1,1,0,0,1,9,14Zm0-3V6a1,1,0,1,1,2,0v5a1,1,0,0,1-2,0Z" fill="#007dff"/>
+</svg>
diff --git a/src/app/assets/svg/verified.svg b/src/app/assets/svg/verified.svg
new file mode 100644
index 0000000000..d7ec021eca
--- /dev/null
+++ b/src/app/assets/svg/verified.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
+  <path id="official_ARK_Ecosystem_plugin" data-name="official ARK Ecosystem plugin" d="M415,404a8,8,0,1,1,8,8A8.01,8.01,0,0,1,415,404Zm2,0a6,6,0,1,0,11.568-2.237l-5.64,5.141a.395.395,0,0,1-.515,0l-2.318-2.072a.3.3,0,0,1,0-.46l1.03-.921a.395.395,0,0,1,.515,0l1.031.921,4.677-4.287a.371.371,0,0,1,.131-.075A6,6,0,0,0,417,404Z" transform="translate(-415 -396)" fill="#0a7df8"/>
+</svg>

From 65c9472f165004be97afb121ed7f8e527fdf64a9 Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Tue, 30 Jun 2020 08:22:34 -0300
Subject: [PATCH 3/9] fix: apply ui tweaks

---
 .../plugin/components/PluginHeader/PluginHeader.tsx   |  2 +-
 .../components/PluginSpecs/PluginSpecs.tsx            | 11 ++++++++++-
 2 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/domains/plugin/components/PluginHeader/PluginHeader.tsx b/src/domains/plugin/components/PluginHeader/PluginHeader.tsx
index 2a8471000a..30baa569c0 100644
--- a/src/domains/plugin/components/PluginHeader/PluginHeader.tsx
+++ b/src/domains/plugin/components/PluginHeader/PluginHeader.tsx
@@ -38,7 +38,7 @@ export const PluginHeader = ({ author, category, url, rating, version, size, isI
 			<>
 				<Button data-testid="PluginHeader__button--install">Install</Button>
 				<Button className="ml-3" data-testid="PluginHeader__button--warning" variant="plain">
-					<Icon name="AlertDanger" />
+					<Icon name="Report" />
 				</Button>
 			</>
 		);
diff --git a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
index 864a35ef59..0b4f1013bb 100644
--- a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
+++ b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
@@ -21,6 +21,7 @@ type GridItemProps = {
 	label: string;
 	value: string;
 	textDirection?: string;
+	iconName?: string;
 };
 
 const GridItem = ({ label, value, textDirection }: GridItemProps) => (
@@ -47,7 +48,15 @@ const GridCol = ({ children, colSpan, justify, padding }: GridColProps) => {
 export const PluginSpecs = ({ author, category, url, rating, version, size }: Props) => (
 	<div className="pt-5 mt-5 text-sm border-t border-dashed grid grid-cols-5 divide-x divide-theme-neutral-300 grid-flow-col border-theme-neutral-300">
 		<GridCol>
-			<GridItem label="Author" value={author} />
+			<div className="flex flex-col">
+				<span className="font-bold text-theme-neutral-400">Author</span>
+				<div className="flex items-center">
+					<span className="font-bold text-theme-neutral-600">{author}</span>
+					<div className="ml-3">
+						<Icon name="Verified" />
+					</div>
+				</div>
+			</div>
 		</GridCol>
 		<GridCol padding="px-6">
 			<GridItem label="Category" value={category} />

From f42a749e0341501b30fd129d83ae186271561a28 Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Tue, 30 Jun 2020 08:27:38 -0300
Subject: [PATCH 4/9] fix: adjust spacing

---
 src/domains/plugin/components/Comments/Comments.tsx      | 1 -
 src/domains/plugin/pages/PluginDetails/PluginDetails.tsx | 3 ++-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/domains/plugin/components/Comments/Comments.tsx b/src/domains/plugin/components/Comments/Comments.tsx
index 844701b1bb..943f074fa8 100644
--- a/src/domains/plugin/components/Comments/Comments.tsx
+++ b/src/domains/plugin/components/Comments/Comments.tsx
@@ -43,7 +43,6 @@ export const Comments = ({ comments, sortOptions }: CommentsProps) => {
 
 	return (
 		<div className="w-full">
-			<p className="text-2xl font-bold">Reviews ARK Explorer</p>
 			<div className="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900">
 				<span>Sort by:</span>
 				<div className="flex items-center">
diff --git a/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx b/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx
index 5f99d0fe08..0a7954980c 100644
--- a/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx
+++ b/src/domains/plugin/pages/PluginDetails/PluginDetails.tsx
@@ -31,7 +31,8 @@ export const PluginDetails = ({ pluginData, reviewData, isInstalled }: PluginDet
 			/>
 			<PluginInfo about={about} permissions={permissions} screenshots={screenshots} />
 			<div className="mt-5 bg-theme-background">
-				<div className="py-16 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300">
+				<p className="pt-10 pb-3 mx-10 text-2xl font-bold">Reviews ARK Explorer</p>
+				<div className="mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300">
 					<div className="col-span-2" data-testid="plugin-details__comments">
 						<Comments comments={comments} sortOptions={commentsSortingOptions} />
 					</div>

From 4e88e3162f49846d748385088429627795f62272 Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Tue, 30 Jun 2020 08:36:43 -0300
Subject: [PATCH 5/9] tests: update snapshots

---
 .../__snapshots__/Comments.test.tsx.snap      |  22 ++--
 .../__snapshots__/PluginHeader.test.tsx.snap  |  56 ++++++++--
 .../__snapshots__/PluginSpecs.test.tsx.snap   |  27 ++++-
 .../__snapshots__/PluginDetails.test.tsx.snap | 100 ++++++++++++------
 4 files changed, 140 insertions(+), 65 deletions(-)

diff --git a/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap b/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap
index 81aa2d74ab..c628ec1ce5 100644
--- a/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap
+++ b/src/domains/plugin/components/Comments/__snapshots__/Comments.test.tsx.snap
@@ -5,11 +5,6 @@ exports[`Comments should handle sortBy properly 1`] = `
   <div
     class="w-full"
   >
-    <p
-      class="text-2xl font-bold"
-    >
-      Reviews ARK Explorer
-    </p>
     <div
       class="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900"
     >
@@ -89,7 +84,7 @@ exports[`Comments should handle sortBy properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                10 days ago
+                3 days ago
               </span>
             </div>
           </div>
@@ -144,7 +139,7 @@ exports[`Comments should handle sortBy properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                10 days ago
+                3 days ago
               </span>
             </div>
           </div>
@@ -183,7 +178,7 @@ exports[`Comments should handle sortBy properly 1`] = `
                 <span
                   class="px-3"
                 >
-                  10 days ago
+                  3 days ago
                 </span>
               </div>
             </div>
@@ -307,11 +302,6 @@ exports[`Comments should render properly 1`] = `
   <div
     class="w-full"
   >
-    <p
-      class="text-2xl font-bold"
-    >
-      Reviews ARK Explorer
-    </p>
     <div
       class="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900"
     >
@@ -391,7 +381,7 @@ exports[`Comments should render properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                10 days ago
+                3 days ago
               </span>
             </div>
           </div>
@@ -446,7 +436,7 @@ exports[`Comments should render properly 1`] = `
               <span
                 class="text-theme-neutral-400"
               >
-                10 days ago
+                3 days ago
               </span>
             </div>
           </div>
@@ -485,7 +475,7 @@ exports[`Comments should render properly 1`] = `
                 <span
                   class="px-3"
                 >
-                  10 days ago
+                  3 days ago
                 </span>
               </div>
             </div>
diff --git a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
index 2aa50c8831..40a65b3a8e 100644
--- a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
+++ b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
@@ -101,18 +101,35 @@ exports[`PluginHeader should render as installed 1`] = `
             class="flex"
           >
             <div
-              class="flex flex-col undefined"
+              class="flex flex-col"
             >
               <span
                 class="font-bold text-theme-neutral-400"
               >
                 Author
               </span>
-              <span
-                class="font-bold text-theme-neutral-600"
+              <div
+                class="flex items-center"
               >
-                ARK Ecosystem
-              </span>
+                <span
+                  class="font-bold text-theme-neutral-600"
+                >
+                  ARK Ecosystem
+                </span>
+                <div
+                  class="ml-3"
+                >
+                  <div
+                    class="sc-AxirZ iQaTP"
+                    height="1em"
+                    width="1em"
+                  >
+                    <svg>
+                      verified.svg
+                    </svg>
+                  </div>
+                </div>
+              </div>
             </div>
           </div>
           <div
@@ -281,7 +298,7 @@ exports[`PluginHeader should render properly 1`] = `
                 width="1em"
               >
                 <svg>
-                  alert-danger.svg
+                  report.svg
                 </svg>
               </div>
             </button>
@@ -294,18 +311,35 @@ exports[`PluginHeader should render properly 1`] = `
             class="flex"
           >
             <div
-              class="flex flex-col undefined"
+              class="flex flex-col"
             >
               <span
                 class="font-bold text-theme-neutral-400"
               >
                 Author
               </span>
-              <span
-                class="font-bold text-theme-neutral-600"
+              <div
+                class="flex items-center"
               >
-                ARK Ecosystem
-              </span>
+                <span
+                  class="font-bold text-theme-neutral-600"
+                >
+                  ARK Ecosystem
+                </span>
+                <div
+                  class="ml-3"
+                >
+                  <div
+                    class="sc-AxirZ iQaTP"
+                    height="1em"
+                    width="1em"
+                  >
+                    <svg>
+                      verified.svg
+                    </svg>
+                  </div>
+                </div>
+              </div>
             </div>
           </div>
           <div
diff --git a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
index 8423b6c09f..15d0de23b8 100644
--- a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
+++ b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
@@ -9,18 +9,35 @@ exports[`PluginSpecs should render properly 1`] = `
       class="flex"
     >
       <div
-        class="flex flex-col undefined"
+        class="flex flex-col"
       >
         <span
           class="font-bold text-theme-neutral-400"
         >
           Author
         </span>
-        <span
-          class="font-bold text-theme-neutral-600"
+        <div
+          class="flex items-center"
         >
-          ARK Ecosystem
-        </span>
+          <span
+            class="font-bold text-theme-neutral-600"
+          >
+            ARK Ecosystem
+          </span>
+          <div
+            class="ml-3"
+          >
+            <div
+              class="sc-AxjAm cpczEI"
+              height="1em"
+              width="1em"
+            >
+              <svg>
+                verified.svg
+              </svg>
+            </div>
+          </div>
+        </div>
       </div>
     </div>
     <div
diff --git a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
index 75ea88ed06..013bd34c50 100644
--- a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
+++ b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
@@ -60,7 +60,7 @@ exports[`PluginDetails should render properly 1`] = `
                   width="1em"
                 >
                   <svg>
-                    alert-danger.svg
+                    report.svg
                   </svg>
                 </div>
               </button>
@@ -73,18 +73,35 @@ exports[`PluginDetails should render properly 1`] = `
               class="flex"
             >
               <div
-                class="flex flex-col undefined"
+                class="flex flex-col"
               >
                 <span
                   class="font-bold text-theme-neutral-400"
                 >
                   Author
                 </span>
-                <span
-                  class="font-bold text-theme-neutral-600"
+                <div
+                  class="flex items-center"
                 >
-                  ARK Ecosystem
-                </span>
+                  <span
+                    class="font-bold text-theme-neutral-600"
+                  >
+                    ARK Ecosystem
+                  </span>
+                  <div
+                    class="ml-3"
+                  >
+                    <div
+                      class="sc-AxjAm cpczEI"
+                      height="1em"
+                      width="1em"
+                    >
+                      <svg>
+                        verified.svg
+                      </svg>
+                    </div>
+                  </div>
+                </div>
               </div>
             </div>
             <div
@@ -363,8 +380,13 @@ exports[`PluginDetails should render properly 1`] = `
     <div
       class="mt-5 bg-theme-background"
     >
+      <p
+        class="pt-10 pb-3 mx-10 text-2xl font-bold"
+      >
+        Reviews ARK Explorer
+      </p>
       <div
-        class="py-16 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
+        class="mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
       >
         <div
           class="col-span-2"
@@ -373,11 +395,6 @@ exports[`PluginDetails should render properly 1`] = `
           <div
             class="w-full"
           >
-            <p
-              class="text-2xl font-bold"
-            >
-              Reviews ARK Explorer
-            </p>
             <div
               class="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900"
             >
@@ -457,7 +474,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>
@@ -512,7 +529,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>
@@ -551,7 +568,7 @@ exports[`PluginDetails should render properly 1`] = `
                         <span
                           class="px-3"
                         >
-                          10 days ago
+                          3 days ago
                         </span>
                       </div>
                     </div>
@@ -608,7 +625,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>
@@ -663,7 +680,7 @@ exports[`PluginDetails should render properly 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>
@@ -1122,18 +1139,35 @@ exports[`PluginDetails should render properly as installed 1`] = `
               class="flex"
             >
               <div
-                class="flex flex-col undefined"
+                class="flex flex-col"
               >
                 <span
                   class="font-bold text-theme-neutral-400"
                 >
                   Author
                 </span>
-                <span
-                  class="font-bold text-theme-neutral-600"
+                <div
+                  class="flex items-center"
                 >
-                  ARK Ecosystem
-                </span>
+                  <span
+                    class="font-bold text-theme-neutral-600"
+                  >
+                    ARK Ecosystem
+                  </span>
+                  <div
+                    class="ml-3"
+                  >
+                    <div
+                      class="sc-AxjAm cpczEI"
+                      height="1em"
+                      width="1em"
+                    >
+                      <svg>
+                        verified.svg
+                      </svg>
+                    </div>
+                  </div>
+                </div>
               </div>
             </div>
             <div
@@ -1412,8 +1446,13 @@ exports[`PluginDetails should render properly as installed 1`] = `
     <div
       class="mt-5 bg-theme-background"
     >
+      <p
+        class="pt-10 pb-3 mx-10 text-2xl font-bold"
+      >
+        Reviews ARK Explorer
+      </p>
       <div
-        class="py-16 mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
+        class="mx-10 grid grid-cols-2 grid-flow-col divide-x divide-theme-neutral-300"
       >
         <div
           class="col-span-2"
@@ -1422,11 +1461,6 @@ exports[`PluginDetails should render properly as installed 1`] = `
           <div
             class="w-full"
           >
-            <p
-              class="text-2xl font-bold"
-            >
-              Reviews ARK Explorer
-            </p>
             <div
               class="flex items-center mt-5 text-sm font-semibold text-theme-neutral-900"
             >
@@ -1506,7 +1540,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>
@@ -1561,7 +1595,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>
@@ -1600,7 +1634,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                         <span
                           class="px-3"
                         >
-                          10 days ago
+                          3 days ago
                         </span>
                       </div>
                     </div>
@@ -1657,7 +1691,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>
@@ -1712,7 +1746,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       <span
                         class="text-theme-neutral-400"
                       >
-                        10 days ago
+                        3 days ago
                       </span>
                     </div>
                   </div>

From a1a92fa0a8a0fdb3f3451544c8097c8602370427 Mon Sep 17 00:00:00 2001
From: boldninja <rok@ark.io>
Date: Tue, 30 Jun 2020 13:42:49 +0200
Subject: [PATCH 6/9] chore: optimize 2 SVG(s)

Optimized SVG(s):
- src/app/assets/svg/report.svg
- src/app/assets/svg/verified.svg
---
 src/app/assets/svg/report.svg   | 4 +---
 src/app/assets/svg/verified.svg | 4 +---
 2 files changed, 2 insertions(+), 6 deletions(-)

diff --git a/src/app/assets/svg/report.svg b/src/app/assets/svg/report.svg
index d38e31d3cc..2bd781f078 100644
--- a/src/app/assets/svg/report.svg
+++ b/src/app/assets/svg/report.svg
@@ -1,3 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20">
-  <path id="Прямоугольник_скругл._углы_970" data-name="Прямоугольник, скругл. углы 970" d="M0,10A10,10,0,1,1,10,20,10.011,10.011,0,0,1,0,10Zm2,0a8,8,0,1,0,8-8A8.01,8.01,0,0,0,2,10Zm7,4a1,1,0,1,1,1,1A1,1,0,0,1,9,14Zm0-3V6a1,1,0,1,1,2,0v5a1,1,0,0,1-2,0Z" fill="#007dff"/>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20"><path data-name="Прямоугольник, скругл. углы 970" d="M0 10a10 10 0 1110 10A10.011 10.011 0 010 10zm2 0a8 8 0 108-8 8.01 8.01 0 00-8 8zm7 4a1 1 0 111 1 1 1 0 01-1-1zm0-3V6a1 1 0 112 0v5a1 1 0 01-2 0z" fill="#007dff"/></svg>
\ No newline at end of file
diff --git a/src/app/assets/svg/verified.svg b/src/app/assets/svg/verified.svg
index d7ec021eca..f1786d9cc6 100644
--- a/src/app/assets/svg/verified.svg
+++ b/src/app/assets/svg/verified.svg
@@ -1,3 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
-  <path id="official_ARK_Ecosystem_plugin" data-name="official ARK Ecosystem plugin" d="M415,404a8,8,0,1,1,8,8A8.01,8.01,0,0,1,415,404Zm2,0a6,6,0,1,0,11.568-2.237l-5.64,5.141a.395.395,0,0,1-.515,0l-2.318-2.072a.3.3,0,0,1,0-.46l1.03-.921a.395.395,0,0,1,.515,0l1.031.921,4.677-4.287a.371.371,0,0,1,.131-.075A6,6,0,0,0,417,404Z" transform="translate(-415 -396)" fill="#0a7df8"/>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path data-name="official ARK Ecosystem plugin" d="M0 8a8 8 0 118 8 8.01 8.01 0 01-8-8zm2 0a6 6 0 1011.568-2.237l-5.64 5.141a.395.395 0 01-.515 0L5.095 8.832a.3.3 0 010-.46l1.03-.921a.395.395 0 01.515 0l1.031.921 4.677-4.287a.371.371 0 01.131-.075A6 6 0 002 8z" fill="#0a7df8"/></svg>
\ No newline at end of file

From 1092e0ee603b2d1a1e438836cf501d895323dabd Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Tue, 30 Jun 2020 09:42:03 -0300
Subject: [PATCH 7/9] fix: use the correct asset to official plugin

---
 src/app/assets/svg/index.ts                                   | 2 --
 src/app/assets/svg/verified.svg                               | 3 ---
 .../PluginHeader/__snapshots__/PluginHeader.test.tsx.snap     | 4 ++--
 .../PluginHeader/components/PluginSpecs/PluginSpecs.tsx       | 2 +-
 .../PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap       | 2 +-
 .../PluginDetails/__snapshots__/PluginDetails.test.tsx.snap   | 4 ++--
 6 files changed, 6 insertions(+), 11 deletions(-)
 delete mode 100644 src/app/assets/svg/verified.svg

diff --git a/src/app/assets/svg/index.ts b/src/app/assets/svg/index.ts
index b4a55a043e..27bdab365a 100644
--- a/src/app/assets/svg/index.ts
+++ b/src/app/assets/svg/index.ts
@@ -88,7 +88,6 @@ import { ReactComponent as Twitter } from "./twitter.svg";
 import { ReactComponent as Update } from "./update.svg";
 import { ReactComponent as Upload } from "./upload.svg";
 import { ReactComponent as User } from "./user.svg";
-import { ReactComponent as Verified } from "./verified.svg";
 import { ReactComponent as Voted } from "./voted.svg";
 
 export const SvgCollection: any = {
@@ -172,7 +171,6 @@ export const SvgCollection: any = {
 	Update,
 	Upload,
 	Voted,
-	Verified,
 	Notification,
 	User,
 	Exchange,
diff --git a/src/app/assets/svg/verified.svg b/src/app/assets/svg/verified.svg
deleted file mode 100644
index d7ec021eca..0000000000
--- a/src/app/assets/svg/verified.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 16 16">
-  <path id="official_ARK_Ecosystem_plugin" data-name="official ARK Ecosystem plugin" d="M415,404a8,8,0,1,1,8,8A8.01,8.01,0,0,1,415,404Zm2,0a6,6,0,1,0,11.568-2.237l-5.64,5.141a.395.395,0,0,1-.515,0l-2.318-2.072a.3.3,0,0,1,0-.46l1.03-.921a.395.395,0,0,1,.515,0l1.031.921,4.677-4.287a.371.371,0,0,1,.131-.075A6,6,0,0,0,417,404Z" transform="translate(-415 -396)" fill="#0a7df8"/>
-</svg>
diff --git a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
index 40a65b3a8e..9db3fd92cc 100644
--- a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
+++ b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
@@ -125,7 +125,7 @@ exports[`PluginHeader should render as installed 1`] = `
                     width="1em"
                   >
                     <svg>
-                      verified.svg
+                      official-ark-plugin.svg
                     </svg>
                   </div>
                 </div>
@@ -335,7 +335,7 @@ exports[`PluginHeader should render properly 1`] = `
                     width="1em"
                   >
                     <svg>
-                      verified.svg
+                      official-ark-plugin.svg
                     </svg>
                   </div>
                 </div>
diff --git a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
index 0b4f1013bb..ecc1b27136 100644
--- a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
+++ b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/PluginSpecs.tsx
@@ -53,7 +53,7 @@ export const PluginSpecs = ({ author, category, url, rating, version, size }: Pr
 				<div className="flex items-center">
 					<span className="font-bold text-theme-neutral-600">{author}</span>
 					<div className="ml-3">
-						<Icon name="Verified" />
+						<Icon name="OfficialArkPlugin" />
 					</div>
 				</div>
 			</div>
diff --git a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
index 15d0de23b8..b7306d399c 100644
--- a/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
+++ b/src/domains/plugin/components/PluginHeader/components/PluginSpecs/__snapshots__/PluginSpecs.test.tsx.snap
@@ -33,7 +33,7 @@ exports[`PluginSpecs should render properly 1`] = `
               width="1em"
             >
               <svg>
-                verified.svg
+                official-ark-plugin.svg
               </svg>
             </div>
           </div>
diff --git a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
index 013bd34c50..068c5f8f0a 100644
--- a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
+++ b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
@@ -97,7 +97,7 @@ exports[`PluginDetails should render properly 1`] = `
                       width="1em"
                     >
                       <svg>
-                        verified.svg
+                        official-ark-plugin.svg
                       </svg>
                     </div>
                   </div>
@@ -1163,7 +1163,7 @@ exports[`PluginDetails should render properly as installed 1`] = `
                       width="1em"
                     >
                       <svg>
-                        verified.svg
+                        official-ark-plugin.svg
                       </svg>
                     </div>
                   </div>

From c2e1197687846ae8a056740340712192c37ad8b0 Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Wed, 1 Jul 2020 12:12:16 -0300
Subject: [PATCH 8/9] fix: icon size after optimization needs to be fixed

---
 src/domains/plugin/components/PluginHeader/PluginHeader.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/src/domains/plugin/components/PluginHeader/PluginHeader.tsx b/src/domains/plugin/components/PluginHeader/PluginHeader.tsx
index 30baa569c0..096cb3c958 100644
--- a/src/domains/plugin/components/PluginHeader/PluginHeader.tsx
+++ b/src/domains/plugin/components/PluginHeader/PluginHeader.tsx
@@ -25,7 +25,7 @@ export const PluginHeader = ({ author, category, url, rating, version, size, isI
 						<Icon name="Update" />
 					</Button>
 					<Button className="ml-3" data-testid="PluginHeader__button--warning" variant="plain">
-						<Icon name="AlertDanger" />
+						<Icon name="Report" width={20} height={20} />
 					</Button>
 					<Button className="ml-3" data-testid="PluginHeader__button--uninstall" variant="plain">
 						<Icon name="Trash" />
@@ -38,7 +38,7 @@ export const PluginHeader = ({ author, category, url, rating, version, size, isI
 			<>
 				<Button data-testid="PluginHeader__button--install">Install</Button>
 				<Button className="ml-3" data-testid="PluginHeader__button--warning" variant="plain">
-					<Icon name="Report" />
+					<Icon name="Report" width={20} height={20} />
 				</Button>
 			</>
 		);

From 8ceeebd40c821c6814a6c4f604a4b081fa86ef25 Mon Sep 17 00:00:00 2001
From: Caio Alcantara <alcantaracaiolucas@gmail.com>
Date: Wed, 1 Jul 2020 12:14:42 -0300
Subject: [PATCH 9/9] tests: update snapshots

---
 .../__snapshots__/PluginHeader.test.tsx.snap       | 14 +++++++-------
 .../__snapshots__/PluginDetails.test.tsx.snap      | 14 +++++++-------
 2 files changed, 14 insertions(+), 14 deletions(-)

diff --git a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
index 9db3fd92cc..2e442e59fe 100644
--- a/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
+++ b/src/domains/plugin/components/PluginHeader/__snapshots__/PluginHeader.test.tsx.snap
@@ -67,12 +67,12 @@ exports[`PluginHeader should render as installed 1`] = `
               type="button"
             >
               <div
-                class="sc-AxirZ iQaTP"
-                height="1em"
-                width="1em"
+                class="sc-AxirZ eEbZjj"
+                height="20"
+                width="20"
               >
                 <svg>
-                  alert-danger.svg
+                  report.svg
                 </svg>
               </div>
             </button>
@@ -293,9 +293,9 @@ exports[`PluginHeader should render properly 1`] = `
               type="button"
             >
               <div
-                class="sc-AxirZ iQaTP"
-                height="1em"
-                width="1em"
+                class="sc-AxirZ eEbZjj"
+                height="20"
+                width="20"
               >
                 <svg>
                   report.svg
diff --git a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
index 068c5f8f0a..6639a49859 100644
--- a/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
+++ b/src/domains/plugin/pages/PluginDetails/__snapshots__/PluginDetails.test.tsx.snap
@@ -55,9 +55,9 @@ exports[`PluginDetails should render properly 1`] = `
                 type="button"
               >
                 <div
-                  class="sc-AxjAm cpczEI"
-                  height="1em"
-                  width="1em"
+                  class="sc-AxjAm buCJuk"
+                  height="20"
+                  width="20"
                 >
                   <svg>
                     report.svg
@@ -1105,12 +1105,12 @@ exports[`PluginDetails should render properly as installed 1`] = `
                 type="button"
               >
                 <div
-                  class="sc-AxjAm cpczEI"
-                  height="1em"
-                  width="1em"
+                  class="sc-AxjAm buCJuk"
+                  height="20"
+                  width="20"
                 >
                   <svg>
-                    alert-danger.svg
+                    report.svg
                   </svg>
                 </div>
               </button>