Explore metrics: Add bookmarks empty state (#94291)

* add empty state component for bookmarks

* translations

* remove image, update text

* all text

public/app/features/trails/DataTrailsHome.tsx

@@ -4,8 +4,9 @@ import { Navigate } from 'react-router-dom-v5-compat';
 
 import { GrafanaTheme2 } from '@grafana/data';
 import { SceneComponentProps, sceneGraph, SceneObject, SceneObjectBase, SceneObjectState } from '@grafana/scenes';
-import { Button, Stack, useStyles2 } from '@grafana/ui';
+import { Button, EmptyState, Stack, useStyles2 } from '@grafana/ui';
 import { Text } from '@grafana/ui/src/components/Text/Text';
+import { Trans } from '@grafana/ui/src/utils/i18n';
 
 import { DataTrail } from './DataTrail';
 import { DataTrailCard } from './DataTrailCard';
@@ -88,7 +89,8 @@ export class DataTrailsHome extends SceneObjectBase<DataTrailsHomeState> {
           <div className={styles.column}>
             <Text variant="h4">Bookmarks</Text>
             <div className={styles.trailList}>
-              {getTrailStore().bookmarks.map((bookmark, index) => {
+              {getTrailStore().bookmarks.length ? (
+                getTrailStore().bookmarks.map((bookmark, index) => {
                   return (
                     <DataTrailCard
                       key={getBookmarkKey(bookmark)}
@@ -97,7 +99,15 @@ export class DataTrailsHome extends SceneObjectBase<DataTrailsHomeState> {
                       onDelete={() => onDelete(index)}
                     />
                   );
-              })}
+                })
+              ) : (
+                <EmptyState variant="call-to-action" message="" image={false}>
+                  <Trans i18nKey="trails.bookmarks.empty-state">
+                    You haven&apos;t created any bookmarks yet. Use the Explore Metrics bookmarks feature to save your
+                    panels as bookmarks.
+                  </Trans>
+                </EmptyState>
+              )}
             </div>
           </div>
         </Stack>

public/locales/en-US/grafana.json

@@ -2676,6 +2676,9 @@
     }
   },
   "trails": {
+    "bookmarks": {
+      "empty-state": "You haven't created any bookmarks yet. Use the Explore Metrics bookmarks feature to save your panels as bookmarks."
+    },
     "metric-overview": {
       "description-label": "Description",
       "labels": "Labels",

public/locales/pseudo-LOCALE/grafana.json

@@ -2676,6 +2676,9 @@
     }
   },
   "trails": {
+    "bookmarks": {
+      "empty-state": "Ÿőū ĥävęʼn'ŧ čřęäŧęđ äʼny þőőĸmäřĸş yęŧ. Ůşę ŧĥę Ēχpľőřę Męŧřįčş þőőĸmäřĸş ƒęäŧūřę ŧő şävę yőūř päʼnęľş äş þőőĸmäřĸş."
+    },
     "metric-overview": {
       "description-label": "Đęşčřįpŧįőʼn",
       "labels": "Ŀäþęľş",