upcoming: [UIE-9565] - Implement Empty Landing State for Network Load Balancers (#13132)

* upcoming: [UIE-9565] - Implement Empty Landing State for Network Load Balancers

* Added changeset:  Implement Empty Landing State for Network Load Balancers

* switched the description variant from one-off h3 variant to subtitle1

Author: harsh-akamai

packages/manager/.changeset/pr-13132-upcoming-features-1764056438332.md

@@ -0,0 +1,5 @@
+---
+"@linode/manager": Upcoming Features
+---
+
+ Implement Empty Landing State for Network Load Balancers ([#13132](https://github.com/linode/manager/pull/13132))

packages/manager/src/features/NetworkLoadBalancers/NetworkLoadBalancersLanding/NetworkLoadBalancersLandingEmptyState.tsx

@@ -1,14 +1,43 @@
+import { Typography } from '@linode/ui';
 import * as React from 'react';
 
+import DocsIcon from 'src/assets/icons/docs.svg';
+import NetworkIcon from 'src/assets/icons/entityIcons/networking.svg';
 import { DocumentTitleSegment } from 'src/components/DocumentTitle';
 import { Placeholder } from 'src/components/Placeholder/Placeholder';
 
-// This will be implemented as part of a different story.
+import { NLB_API_DOCS_LINK } from '../constants';
+
 export const NetworkLoadBalancersLandingEmptyState = () => {
   return (
     <React.Fragment>
       <DocumentTitleSegment segment="Network Load Balancer" />
-      <Placeholder isEntity title="Network Load Balancer"></Placeholder>
+      <Placeholder
+        buttonProps={[
+          {
+            buttonType: 'outlined',
+            startIcon: <DocsIcon />,
+            children: 'Learn More',
+            href: NLB_API_DOCS_LINK,
+            target: '_blank',
+            sx: {
+              '&:hover, &:focus': {
+                textDecoration: 'none',
+              },
+            },
+            rel: 'noopener noreferrer',
+          },
+        ]}
+        icon={NetworkIcon}
+        isEntity
+        subtitle="High Capacity load balancing service"
+        title="Network Load Balancer"
+      >
+        <Typography variant="subtitle1">
+          Deliver real-time, high-volume traffic management for your most
+          demanding workloads.
+        </Typography>
+      </Placeholder>
     </React.Fragment>
   );
 };