Dashboard: Implement Duplicate DashboardLink Feature (#26600)

* Dashboard: Implement duplicate dashboard link feature

* Dashboard: Change duplicate and remove button types of DashboardLinks

docs/sources/linking/dashboard-links.md

@@ -62,6 +62,10 @@ To change or update an existing dashboard link, follow this procedure.
 1. In Dashboard Settings, on the Links tab, click the existing link that you want to edit.
 1. Change the settings and then click **Update**.
 
+## Duplicate a dashboard link
+
+To duplicate an existing dashboard link, click the duplicate icon next to the existing link that you want to duplicate.
+
 ## Delete a dashboard link
 
-To delete an existing dashboard link, click the red **X** next to the existing link that you want to delete.
+To delete an existing dashboard link, click the trash icon next to the duplicate icon that you want to delete.

public/app/features/dashboard/components/DashLinks/DashLinksEditorCtrl.ts

@@ -74,6 +74,11 @@ export class DashLinksEditorCtrl {
     _.move(this.dashboard.links, index, index + dir);
   }
 
+  duplicateLink(link: any, index: number) {
+    this.dashboard.links.splice(index, 0, link);
+    this.dashboard.updateSubmenuVisibility();
+  }
+
   deleteLink(index: number) {
     this.dashboard.links.splice(index, 1);
     this.dashboard.updateSubmenuVisibility();

public/app/features/dashboard/components/DashLinks/editor.html

@@ -39,7 +39,7 @@
         </tr>
       </thead>
       <tbody>
-        <tr ng-repeat="link in ctrl.dashboard.links">
+        <tr ng-repeat="link in ctrl.dashboard.links track by $index">
           <td class="pointer" ng-click="ctrl.editLink(link)">
             <icon name="'external-link-alt'"></icon>
             {{ link.type }}
@@ -68,8 +68,13 @@
             <icon ng-click="ctrl.moveLink($index, 1)" ng-hide="$last" name="'arrow-down'"></icon>
           </td>
           <td style="width: 1%">
-            <a ng-click="ctrl.deleteLink($index)" class="btn btn-danger btn-small" ng-hide="annotation.builtIn">
-              <icon name="'times'" style="margin-bottom: 0;"></icon>
+            <a ng-click="ctrl.duplicateLink(link, $index)" class="btn">
+              <icon name="'copy'" style="margin-bottom: 0;"></icon>
+            </a>
+          </td>
+          <td style="width: 1%">
+            <a ng-click="ctrl.deleteLink($index)" class="btn" ng-hide="annotation.builtIn">
+              <icon name="'trash-alt'" style="margin-bottom: 0;"></icon>
             </a>
           </td>
         </tr>