fleetfolio/aws_ec2_instance_detail.sql

              SELECT 'dynamic' AS component, sqlpage.run_sql('shell/shell.sql') AS properties;
              -- not including breadcrumbs from sqlpage_aide_navigation
              -- not including page title from sqlpage_aide_navigation
              

               SELECT 'title' AS component, (SELECT COALESCE(title, caption)
    FROM sqlpage_aide_navigation
   WHERE namespace = 'prime' AND path = 'fleetfolio/aws_ec2_instance_detail.sql/index.sql') as contents;
    ;
   --- Display breadcrumb
SELECT
   'breadcrumb' AS component;
 SELECT
   'Home' AS title,
   sqlpage.environment_variable('SQLPAGE_SITE_PREFIX') || '/'    AS link;
 SELECT
   'FleetFolio' AS title,
   sqlpage.environment_variable('SQLPAGE_SITE_PREFIX') || '/fleetfolio/index.sql' AS link;  
 SELECT
   'Boundary' AS title,
   sqlpage.environment_variable('SQLPAGE_SITE_PREFIX') || '/fleetfolio/boundary.sql' AS link; 
 SELECT
   'AWS Trust Boundary' AS title,
   sqlpage.environment_variable('SQLPAGE_SITE_PREFIX') || '/fleetfolio/aws_trust_boundary_list.sql' AS link; 

 SELECT
   'AWS EC2 instance' AS title,
   sqlpage.environment_variable('SQLPAGE_SITE_PREFIX') || '/fleetfolio/aws_ec2_instance_list.sql' AS link; 
 SELECT
   title,
   sqlpage.environment_variable('SQLPAGE_SITE_PREFIX') || '/fleetfolio/aws_ec2_instance_detail.sql?instance_id=' || instance_id AS link FROM list_aws_ec2_instance WHERE instance_id=$instance_id; 

 --- Dsply Page Title
   SELECT
     'title'   as component,
     title as contents FROM list_aws_ec2_instance WHERE instance_id=$instance_id;

   select
     'text'              as component,
     'An EC2 instance represents a virtual server hosted on Amazon Web Services (AWS), used to run applications, services, or processes in a scalable and flexible cloud environment. Each instance is provisioned with a specific configuration—such as CPU, memory, storage, and networking capabilities—to meet the needs of the workload it supports. EC2 instances are a core component of cloud infrastructure, enabling users to deploy and manage computing resources without the need for physical hardware. They can be started, stopped, resized, or terminated as needed, offering full control over performance, cost, and security.' as contents;

    select 
           'html' as component,
           '<div style="display: flex; gap: 20px; width: 100%;">
               <!-- First Column -->
               <div style="display: flex; flex-direction: column; gap: 8px; padding: 12px; border: .5px solid #ccc;  border-radius: 4px; width: 33%; background-color: #ffffff;">
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Architecture</div>
                       <div>'|| architecture ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Platform</div>
                       <div>'|| platform_details ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Root Device Name</div>
                       <div>'|| root_device_name ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px;">
                       <div class="datagrid-title">Type </div>
                       <div>'|| instance_type ||'</div>
                   </div>
               </div> 

               <!-- Second Column -->
               <div style="display: flex; flex-direction: column; gap: 8px; padding: 12px; border: .5px solid #ccc; border-radius: 4px; width: 33%; background-color: #ffffff;">
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">state</div>
                       <div>'|| state ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Cpu options core count</div>
                       <div>'|| cpu_options_core_count ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Availability Zone</div>
                       <div>'|| az ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px;">
                       <div class="datagrid-title">Launch Time</div>
                       <div>'|| datetime(substr(launch_time, 1, 19)) ||'</div>
                   </div>
               </div> 

               <!-- Third Column -->
               <div style="display: flex; flex-direction: column; gap: 8px; padding: 12px; border: .5px solid #ccc; border-radius: 4px; width: 33%; background-color: #ffffff;">
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Private IP Address</div>
                       <div>'|| private_ip_address ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Mac Address</div>
                       <div>'|| mac_address ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">Public IP Address</div>
                       <div>'|| COALESCE(public_ip_address, 'No IP address') ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px;">
                       <div class="datagrid-title">Status</div>
                       <div>'|| status ||'</div>
                   </div>
               </div>
                <!-- Fourth Column -->
               <div style="display: flex; flex-direction: column; gap: 8px; padding: 12px; border: .5px solid #ccc; border-radius: 4px; width: 33%; background-color: #ffffff;">
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">VPC</div>
                       <div>'|| COALESCE(vpc_name, 'No VPC name available') ||'</div>
                   </div>
                   <div style="display: flex; justify-content: space-between; padding: 4px; border-bottom: 1px solid #eee;">
                       <div class="datagrid-title">VPC State</div>
                       <div>'|| COALESCE(vpc_state, 'No VPC state available') ||'</div>
                   </div>
           
               </div>
           </div>

       ' as html FROM list_aws_ec2_instance WHERE instance_id=$instance_id;