This open issue is to allow testing components outside of Meshery UI, as this will cause breaking issues while developing in the Meshery repository.

Features

• Uses Next.js 14

  Uses Next.js API Routes to rewrite routes and proxy incoming requests from the backend

  Uses the latest libraries from MUI plus @mui/material-nextjs

  Refactored Color definitions (will be added to Sistent)

  Refactor components in Theme

  Icons - testing to use SvgIcon from MUI

  Move Provider's login into one - [UI] Wrap Provider UI as an React Context in ui meshery/meshery#7212
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

Refactor Class components to Function components

• Header - [UI] Convert Header.js to Functional Component meshery/meshery#8721

  ReactSelectWrapper - [UI] Convert ReactSelectWrapper to Functional meshery/meshery#8722
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

Components that are transferred but worked on to be improved This list will change and reflect a potential name change in order to make sure refactoring easier

• BBChart

  Dashboard

  ConnectionWizard

  DateFormatter

  DryRun

  KubernetesEmptyState

  ErrorBoundary

  LifeCycle

  Loading

  Registry

  Applications

  Filters

  Patterns or Designs

  Performance

  Modals

  GenericModal

  ConfirmationModal

  TroubleshootingModal

  ExportModal

  ResultModal

  EditorModal

  LoadTestTimerModal

  PromptModal

  NotificationCenter

  TypingFilter

  Preferences

  Carousel

  Extensions

  Connections

  Subscription

  EditorConfigurator

  MeshModelConfigurator

  Breadcrumb

  Telemetry

  Charts

  Graphs

  Avatar

  ToolbarSelect

  TableFooter

  DatabaseSummary

  FlipCard

  Header

  DateTimePicker

  Metrics

  MesheryPlay

  ProgressBar

  Results

  Settings

  SnackbarWrapper

  Navigator

  NavigatorExtension

  ReactSelectWrapper

  RemoteComponent

  URLUploader

  UploadImport

  User

  Validation

  ViewSwitch

  MuiltiSelect

  Tooltip

  EarlyAccessCard
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

Custom hooks

• useDashboardRouter

  useFetchUserData

  useKubernetes

  useMeshModelComponent

  useNotification

  usePreventUserFromLeaving

  useStateCallback

  useTelemetry

  useUpdateMetadata
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

@reduxjst/toolkit slices

• Theme mode

  Authentication

  Kubernetes configuration

  Grafana configuration

  Prometheus configuration

  Load test performance configuration

  Drawer state (may be moved to use state/props) that will pass through the components that uses this specifically

  Provider login

  Session data

  User information

  Version information

  Progress
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

RTK Query

• Provider login retrieval
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

Custom styled components

• ConnectClustersButton

  CreateButton

  DashbaordInfoOutlined

  DashbaordLayout

  DashboardSection

  DashboardSubMenuTab

  DashboardTab

  DashboardTabs

  Errors404

  InnerContainer

  InnerContainerAnimate

  MainContainer

  MainContainerAnimate

  MeshModelToolbar

  PaperSquare

  SearchAndView

  ToolWrapper

  ToolWrapperAnimate
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

To Do List

• Research editor packages again and add to app
  To pick up a draggable item, press the space bar. While dragging, use the arrow keys to move the item. Press space again to drop the item in its new position, or press escape to cancel.

Contributor Guide

• 🎨 Wireframes and designs for Layer5 site in Figma (open invite)