Merge pull request #5288 from ethereum/iconForMaintained

new color for Maintained by and adding external maintainers as an option

libs/remix-ui/home-tab/src/lib/components/homeTabFeaturedPlugins.tsx

@@ -122,7 +122,7 @@ function HomeTabFeaturedPlugins({ plugin }: HomeTabFeaturedPluginsProps) {
               description={intl.formatMessage({
                 id: 'home.codeAnalyizerPluginDesc'
               })}
-              remixMaintained={true}
+              maintainedBy='Remix'
               callback={() => startCodeAnalyzer()}
             />
             <PluginButton
@@ -132,7 +132,7 @@ function HomeTabFeaturedPlugins({ plugin }: HomeTabFeaturedPluginsProps) {
               description={intl.formatMessage({
                 id: 'home.learnEthPluginDesc'
               })}
-              remixMaintained={true}
+              maintainedBy='Remix'
               callback={() => startLearnEth()}
             />
             <PluginButton
@@ -140,7 +140,7 @@ function HomeTabFeaturedPlugins({ plugin }: HomeTabFeaturedPluginsProps) {
               envID="cookbookLogo"
               envText="Cookbook"
               description={intl.formatMessage({ id: 'home.cookbookDesc' })}
-              remixMaintained={false}
+              maintainedBy="Cookbook"
               callback={() => startCookbook()}
             />
             <PluginButton
@@ -148,7 +148,7 @@ function HomeTabFeaturedPlugins({ plugin }: HomeTabFeaturedPluginsProps) {
               envID="solidityLogo"
               envText="Solidity"
               description={intl.formatMessage({ id: 'home.solidityPluginDesc' })}
-              remixMaintained={true}
+              maintainedBy='Remix'
               callback={() => startSolidity()}
             />
             <PluginButton
@@ -156,7 +156,7 @@ function HomeTabFeaturedPlugins({ plugin }: HomeTabFeaturedPluginsProps) {
               envID="sUTLogo"
               envText="Solidity unit testing"
               description={intl.formatMessage({ id: 'home.unitTestPluginDesc' })}
-              remixMaintained={true}
+              maintainedBy='Remix'
               callback={() => startSolidityUnitTesting()}
             />
           </Carousel>

libs/remix-ui/home-tab/src/lib/components/pluginButton.tsx

@@ -10,10 +10,10 @@ interface PluginButtonProps {
   callback: any
   l2?: boolean
   description: string
-  remixMaintained?: boolean
+  maintainedBy?: string
 }
 
-function PluginButton({ imgPath, envID, envText, callback, l2, description, remixMaintained }: PluginButtonProps) {
+function PluginButton({ imgPath, envID, envText, callback, l2, description, maintainedBy }: PluginButtonProps) {
   const themeFilter = useContext(ThemeContext)
 
   return (
@@ -30,13 +30,17 @@ function PluginButton({ imgPath, envID, envText, callback, l2, description, remi
         </div>
       </button>
       {l2 && <label className="bg-light mx-1 px-1 mb-0 mx-2 position-absolute remixui_home_l2Label">L2</label>}
-      {remixMaintained ? (
+      { maintainedBy?.toLowerCase() === 'remix' ? (
         <CustomTooltip placement="bottom" tooltipId="overlay-tooltip-by-remix" tooltipText={<FormattedMessage id="home.maintainedByRemix" />}>
           <i className="bg-light text-success mx-1 px-1 mb-0 mx-2 position-absolute remixui_home_maintainedLabel fas fa-check"></i>
-        </CustomTooltip>)
+        </CustomTooltip>) :
-        : (<CustomTooltip placement="bottom" tooltipId="overlay-tooltip-external" tooltipText={<FormattedMessage id="panel.maintainedExternally" />}>
+        maintainedBy ?
-          <i aria-hidden="true" className="bg-light mx-1 px-1 mb-0 mx-2 position-absolute remixui_home_maintainedLabel  text-warning far fa-exclamation-circle"></i>
+          (<CustomTooltip placement="bottom" tooltipId="overlay-tooltip-external" tooltipText={"Maintained by " + maintainedBy}>
-        </CustomTooltip>)
+            <i aria-hidden="true" className="bg-light mx-1 px-1 mb-0 mx-2 position-absolute remixui_home_maintainedLabel text-secondary far fa-exclamation-circle"></i>
+          </CustomTooltip>)
+          : (<CustomTooltip placement="bottom" tooltipId="overlay-tooltip-external" tooltipText={<FormattedMessage id="panel.maintainedExternally" />}>
+            <i aria-hidden="true" className="bg-light mx-1 px-1 mb-0 mx-2 position-absolute remixui_home_maintainedLabel text-secondary far fa-exclamation-circle"></i>
+          </CustomTooltip>)
       }
     </div>
   )

libs/remix-ui/panel/src/lib/plugins/panel-header.tsx

@@ -48,13 +48,17 @@ const RemixUIPanelHeader = (props: RemixPanelProps) => {
         </h6>
         <div className="d-flex flex-row">
           <div className="d-flex flex-row">
-            {plugin?.profile?.maintainedBy?.toLowerCase() === 'remix' ? (
+            { plugin?.profile?.maintainedBy?.toLowerCase() === 'remix' ? (
-              <CustomTooltip placement="auto-end" tooltipId="maintainedByTooltip" tooltipClasses="text-nowrap" tooltipText={<FormattedMessage id="panel.maintainedByRemix" />}>
+              <CustomTooltip placement="auto" tooltipId="maintainedByTooltipRemix" tooltipText={<FormattedMessage id="home.maintainedByRemix" />}>
-                <i aria-hidden="true" className="text-success mt-1 px-1 fas fa-check"></i>
+                <i className="text-success mt-1 px-1 fas fa-check"></i>
-              </CustomTooltip>)
+              </CustomTooltip>) :
-              : (<CustomTooltip placement="auto-end" tooltipId="maintainedExternally" tooltipClasses="text-nowrap" tooltipText={<FormattedMessage id="panel.maintainedExternally" />}>
+              plugin?.profile?.maintainedBy ?
-                <i aria-hidden="true" className="mt-1 px-1 text-warning far fa-exclamation-circle"></i>
+                (<CustomTooltip placement="auto" tooltipId={"maintainedByTooltip" + plugin?.profile?.maintainedBy} tooltipText={"Maintained by " + plugin?.profile?.maintainedBy}>
-              </CustomTooltip>)
+                  <i aria-hidden="true" className="mt-1 px-1 text-secondary far fa-exclamation-circle"></i>
+                </CustomTooltip>)
+                : (<CustomTooltip placement="auto" tooltipId="maintainedByTooltipRemixUnknown" tooltipText={<FormattedMessage id="panel.maintainedExternally" />}>
+                  <i aria-hidden="true" className="mt-1 px-1 text-secondary far fa-exclamation-circle"></i>
+                </CustomTooltip>)
             }
           </div>
           <div className="swapitHeaderInfoSection d-flex justify-content-between" data-id="swapitHeaderInfoSectionId" onClick={toggleClass}>

libs/remix-ui/plugin-manager/src/lib/components/ActivePluginCard.tsx

@@ -26,14 +26,23 @@ function ActivePluginCard({ profile, buttonText, deactivatePlugin }: PluginCardP
                 >
                   <i aria-hidden="true" className="px-1 text-success fas fa-check"></i>
                 </CustomTooltip>)
-                : (<CustomTooltip
+                : profile?.maintainedBy ? (
-                  placement="right"
+                  <CustomTooltip
-                  tooltipId="pluginManagerActiveTitleExternally"
+                    placement="right"
-                  tooltipClasses="text-nowrap"
+                    tooltipId="pluginManagerActiveTitleByRemix"
-                  tooltipText={<FormattedMessage id="pluginManager.maintainedExternally" />}
+                    tooltipClasses="text-nowrap"
-                >
+                    tooltipText={"Maintained by " + profile?.maintainedBy}
-                  <i aria-hidden="true" className="px-1 text-warning far fa-exclamation-circle"></i>
+                  >
-                </CustomTooltip>)
+                    <i aria-hidden="true" className="px-1 text-secondary far fa-exclamation-circle"></i>
+                  </CustomTooltip>)
+                  : (<CustomTooltip
+                    placement="right"
+                    tooltipId="pluginManagerActiveTitleExternally"
+                    tooltipClasses="text-nowrap"
+                    tooltipText={<FormattedMessage id="pluginManager.maintainedExternally" />}
+                  >
+                    <i aria-hidden="true" className="px-1 text-secondary far fa-exclamation-circle"></i>
+                  </CustomTooltip>)
               }
               {profile.documentation && (
                 <CustomTooltip

libs/remix-ui/plugin-manager/src/lib/components/InactivePluginCard.tsx

@@ -37,20 +37,29 @@ function InactivePluginCard({ profile, buttonText, activatePlugin }: PluginCardP
               {profile?.maintainedBy?.toLowerCase() == 'remix' ? (
                 <CustomTooltip
                   placement="right"
-                  tooltipId="pluginManagerInactiveTitleByRemix"
+                  tooltipId="pluginManagerActiveTitleByRemix"
                   tooltipClasses="text-nowrap"
                   tooltipText={<FormattedMessage id="pluginManager.maintainedByRemix" />}
                 >
                   <i aria-hidden="true" className="px-1 text-success fas fa-check"></i>
                 </CustomTooltip>)
-                : (<CustomTooltip
+                : profile?.maintainedBy ? (
-                  placement="right"
+                  <CustomTooltip
-                  tooltipId="pluginManagerInactiveTitleExternally"
+                    placement="right"
-                  tooltipClasses="text-nowrap"
+                    tooltipId="pluginManagerActiveTitleByRemix"
-                  tooltipText={<FormattedMessage id="pluginManager.maintainedExternally" />}
+                    tooltipClasses="text-nowrap"
-                >
+                    tooltipText={"Maintained by " + profile?.maintainedBy}
-                  <i aria-hidden="true" className="px-1 text-warning far fa-exclamation-circle"></i>
+                  >
-                </CustomTooltip>)
+                    <i aria-hidden="true" className="px-1 text-secondary far fa-exclamation-circle"></i>
+                  </CustomTooltip>)
+                  : (<CustomTooltip
+                    placement="right"
+                    tooltipId="pluginManagerActiveTitleExternally"
+                    tooltipClasses="text-nowrap"
+                    tooltipText={<FormattedMessage id="pluginManager.maintainedExternally" />}
+                  >
+                    <i aria-hidden="true" className="px-1 text-secondary far fa-exclamation-circle"></i>
+                  </CustomTooltip>)
               }
               {profile.documentation && (
                 <CustomTooltip