add label

apps/remix-ide/src/app/plugins/templates-selection/templates-selection-plugin.tsx

@@ -157,7 +157,8 @@ export class TemplatesSelectionPlugin extends ViewPlugin {
               key={template.name}
               title={template.name}
               tooltipTitle={template.tooltip}
-              onClickTitle={template.onClick}
+              onClick={template.onClick}
+              onClickLabel={template.onClickLabel}
               hScrollable={false}
             >
               {template.items.map(item => {

apps/remix-ide/src/app/plugins/templates-selection/templates.ts

@@ -260,9 +260,11 @@ export const templates = (intl, plugin) => {
     {
       name: "Cookbook",
       tooltip: "Cookbook is a smart contract search tool. Click here to open cookbook and browse contracts.",
-      onClick: () => {
-        plugin.call('manager', 'activatePlugin', 'cookbookdev')
+      onClick: async () => {
+        await plugin.call('manager', 'activatePlugin', 'cookbookdev')
+        plugin.call('menuicons', 'showContent', 'cookbookdev')
       },
+      onClickLabel: 'Open cookbook plugin',
       items: [
         { value: "token-sale", displayName: 'Token Sale' },
         { value: "simple-nft-sale", displayName: 'Simple Nft Sale' },

libs/remix-ui/grid-view/src/lib/remix-ui-grid-section.tsx

@@ -14,7 +14,8 @@ const _paq = window._paq = window._paq || []
 interface RemixUIGridSectionProps {
   plugin: any
   title?: string
-  onClickTitle?: () => void
+  onClick?: () => void
+  onClickLabel?: string
   tooltipTitle?: string
   hScrollable: boolean
   classList?: string
@@ -64,9 +65,9 @@ export const RemixUIGridSection = (props: RemixUIGridSectionProps) => {
       data-id={"remixUIGS" + props.title}
       style={{ overflowX: 'auto' }}
     >
-      <div className="d-flex flex-column w-100 remixui_grid_section">
+      <div className="w-100 remixui_grid_section">
         { props.title && <h6 className='mt-1 mb-0 align-items-left '>{ props.title }</h6> }
-
+        { props.onClick && <span style={{ cursor: 'pointer' }} className='mt-2 btn btn-sm border align-items-left' onClick={() => props.onClick() }>{ props.onClickLabel }</span> }
         <div className={(props.hScrollable) ? `d-flex flex-row pb-2  overflow-auto` : `d-flex flex-wrap`}>
           { !hasChildCell(children) && <span> No items found </span>}
           { props.children }