style(lesy-pilot-ui): style projects screen

Author: lokesh-coder

packages/misc/pilot-ui/src/app/components/header/header.template.html

@@ -4,7 +4,7 @@
 >
   <div class="container mx-auto">
     <div class="flex flex-wrap items-center">
-      <div class="w-full sm:w-1/3 flex items-center p-5 sm:p-0 justify-center">
+      <div class="w-full sm:w-1/3 flex items-center p-5 sm:p-0 justify-start">
         <i class="ri-dashboard-line mr-3 text-xl text-violet"></i>
         <a class="font-semibold text-gray-700" href="#"
           >{{ config.pilot.appName }}</a
@@ -17,7 +17,7 @@
       <div
         class="w-full sm:w-2/3 flex justify-even sm:justify-end bg-gray-200 sticky top-0 sm:bg-transparent"
       >
-        <ul class="flex w-full  sm:w-auto justify-between items-center">
+        <ul class="flex w-full sm:w-auto justify-between items-center">
           <li
             *ngFor="let menuItem of menuItems"
             routerLinkActive="active"

packages/misc/pilot-ui/src/app/pages/config/config.template.html

@@ -1,7 +1,7 @@
 <div class="container mx-auto">
   <div *ngIf="config">
     <div class="w-full sm:w-2/3 mx-auto px-6 sm:px-0">
-      <h1 class="font-bold font-diplay text-2xl text-vio-900">
+      <h1 class="font-bold font-display text-2xl text-vio-900">
         Configurations
       </h1>
       <div class="bg-white shadow-md rounded my-6">

packages/misc/pilot-ui/src/app/pages/projects/projects.template.html

@@ -1,9 +1,16 @@
-<div class="w-full sm:w-2/3 mx-auto px-6 sm:px-0">
-  <div
-    *ngFor="let project of (projects$|async)"
-    class="p-3"
-    (click)="switchProject(project)"
-  >
-    {{project.name}}
+<div class="container mx-auto">
+  <div class="w-full sm:w-2/3 mx-auto px-6 sm:px-0">
+    <h1 class="font-bold font-display text-3xl text-vio-900 my-8">
+      Projects
+    </h1>
+    <div
+      *ngFor="let project of (projects$|async)"
+      class="m-3 cursor-pointer p-5 bg-gray-200 rounded-lg text-gray-900 inline-flex items-center hover:bg-gray-300 leading-none"
+      (click)="switchProject(project)"
+    >
+      <i class="ri-folder-5-line mr-3 text-xl font-medium"></i>
+      <span>{{project.name}}</span>
+      <span class="opacity-50 ml-3 text-sm">v{{project.version}}</span>
+    </div>
   </div>
 </div>

packages/plugins/lesy-plugin-pilot/src/models.ts

@@ -1,5 +1,5 @@
 export interface LesyWorkSpace {
-  [key: string]: string;
+  [key: string]: any;
 }
 
 export interface SocketInputData {

packages/plugins/lesy-plugin-pilot/src/pilot.command.ts

@@ -79,7 +79,10 @@ export default class PilotCommand {
 
   private getAllProjects(): any[] {
     const projectNames = Object.keys(global.lesyWorkspace);
-    return projectNames.map((name: string) => ({ name }));
+    return projectNames.map((key: string) => {
+      const details = global.lesyWorkspace[key].feature.pkg;
+      return details;
+    });
   }
 
   private switchProject(name: string): void {