📁 Showcase
Dashboard

Dashboard

Backend

1. Dashboard report

a. Input form

ensure form FilterDashboard
  modules: ["MyFitnessPal"]
ensure section: Details
ensure field From kind: date
  required: true
  defaultValue: "startOfMonth"
  displayDateFormat: "dd/MM/yyyy, hh:mm:ss a"
ensure field To kind: date
  required: true
  defaultValue: "endOfMonth"
  displayDateFormat: "dd/MM/yyyy, hh:mm:ss a"

b. Output form

ensure form OutputDashboard
  modules: ["MyFitnessPal"]
ensure grid: ConsumedVsBurned
ensure field Date kind: date
ensure field ConsumedCalories kind: number
ensure field BurnedCalories kind: number

ensure grid: ConsumedCalories
ensure field Date kind: date
ensure field TotalCaloriesCount kind: number

ensure grid: BurnedCalories
ensure field Date kind: date
ensure field TotalCaloriesBurned kind: number

ensure grid: Sleep
ensure field Date kind: date
ensure field TotalHours kind: number

ensure grid: WaterIntake
ensure field Date kind: date
ensure field TotalIntake kind: number
  suffix: "ml"

c. Form layout

ensure form OutputDashboard
ensure grid: ConsumedVsBurned
ensure layoutGrid BarChartLayout kind: xyChartBarGraph 
  xAxis: ConsumedVsBurned.Date
ensure xAxis AxisX
ensure yAxis AxisY1 
  color.value: green 
  color.shade: s300
  field: ConsumedVsBurned.ConsumedCalories
ensure yAxis AxisY2 
  color.value: deepOrange 
  color.shade: s300
  field: ConsumedVsBurned.BurnedCalories

ensure layoutGrid LineChartLayout kind: xyChartLineChart 
  xAxis: ConsumedVsBurned.Date
ensure xAxis AxisX 
ensure yAxis AxisY1 
  color.value: green 
  color.shade: s300
  field: ConsumedVsBurned.ConsumedCalories
ensure yAxis AxisY2 
  color.value: deepOrange 
  color.shade: s300
  field: ConsumedVsBurned.BurnedCalories

ensure grid: ConsumedCalories
ensure layoutGrid BarChartLayout kind: xyChartBarGraph 
  xAxis: ConsumedCalories.Date
ensure xAxis AxisX color.value: green color.shade: s300
ensure yAxis AxisY color.value: green color.shade: s300
  field: ConsumedCalories.TotalCaloriesCount

ensure layoutGrid LineChartLayout kind: xyChartLineChart 
  xAxis: ConsumedCalories.Date
ensure xAxis AxisX color.value: green color.shade: s300
ensure yAxis AxisY color.value: green color.shade: s300
  field: ConsumedCalories.TotalCaloriesCount

ensure layoutGrid TableLayout kind: table 
  columnSizeSet: ["Flex"]
  showComps: [ConsumedCalories.Date, ConsumedCalories.TotalCaloriesCount]

ensure style Style1
  value: black 
  fields: [ConsumedCalories.Date, ConsumedCalories.TotalCaloriesCount] 
  fieldLayoutOn: header 
  textStyleSet: ["bold"] 
  textColor.value: white


ensure grid: BurnedCalories
ensure layoutGrid BarChartLayout kind: xyChartBarGraph 
  xAxis: BurnedCalories.Date
ensure xAxis AxisX color.value: deepOrange color.shade: s300
ensure yAxis AxisY color.value: deepOrange color.shade: s300
  field: BurnedCalories.TotalCaloriesBurned

ensure layoutGrid LineChartLayout kind: xyChartLineChart 
  xAxis: BurnedCalories.Date
ensure xAxis AxisX color.value: deepOrange color.shade: s300
ensure yAxis AxisY color.value: deepOrange color.shade: s300
  field: BurnedCalories.TotalCaloriesBurned

ensure layoutGrid TableLayout kind: table 
  columnSizeSet: ["Flex"]
  showComps: [BurnedCalories.Date, BurnedCalories.TotalCaloriesBurned]

ensure style Style1 
  value: black 
  fields: [BurnedCalories.Date, BurnedCalories.TotalCaloriesBurned] 
  fieldLayoutOn: header 
  textStyleSet: ["bold"] 
  textColor.value: white

ensure grid: Sleep
ensure layoutGrid BarChartLayout kind: xyChartBarGraph 
  xAxis: Sleep.Date
ensure xAxis AxisX
ensure yAxis AxisY field: Sleep.TotalHours

ensure grid: WaterIntake
ensure layoutGrid BarChartLayout kind: xyChartBarGraph 
  xAxis: WaterIntake.Date
ensure xAxis AxisX color.value: blue color.shade: s300
ensure yAxis AxisY color.value: blue color.shade: s300
  field: WaterIntake.TotalIntake

ensure layoutGrid TableLayout kind: table 
  showComps: [WaterIntake.Date, WaterIntake.TotalIntake]

ensure style Style1
  value: black 
  fields: [WaterIntake.Date, WaterIntake.TotalIntake] 
  fieldLayoutOn: header 
  textStyleSet: ["bold"] 
  textColor.value: white

// layout, content, LayoutWater
ensure layout LayoutWater kind: content 
  displayLabel: "Daily water intake in ml" 
  direction: vertical 
  contentPadding: thick 
  flexCenter.showBorderSet: ["top", "bottom", "left", "right"] 
  flexCenter.showPaddingSet: ["top", "bottom", "left", "right"] 
  flexCenter.padding: thick
  flexCenter.gridLayouts: [WaterIntake.BarChartLayout]

// layout, content, LayoutFood
ensure layout LayoutFood kind: content 
  displayLabel: "Daily total consumed calories" 
  direction: vertical 
  contentPadding: thick 
  flexCenter.showBorderSet: ["top", "bottom", "left", "right"] 
  flexCenter.showPaddingSet: ["top", "bottom", "left", "right"] 
  flexCenter.padding: thick
  flexCenter.gridLayouts: [ConsumedCalories.TableLayout]

// layout, content, LayoutExercise
ensure layout LayoutExercise kind: content 
  displayLabel: "Daily total burned calories" 
  direction: vertical 
  contentPadding: thick 
  flexCenter.showBorderSet: ["top", "bottom", "left", "right"] 
  flexCenter.showPaddingSet: ["top", "bottom", "left", "right"] 
  flexCenter.padding: thick
  flexCenter.gridLayouts: [BurnedCalories.TableLayout]

// layout, content, LayoutSleep
ensure layout LayoutSleep kind: content 
  displayLabel: "Daily total hours of sleep" 
  direction: vertical 
  contentPadding: thick 
  flexCenter.showBorderSet: ["top", "bottom", "left", "right"] 
  flexCenter.showPaddingSet: ["top", "bottom", "left", "right"] 
  flexCenter.padding: thick
  flexCenter.gridLayouts: [Sleep.BarChartLayout]

// layout, content, LayoutCalories
ensure layout LayoutCalories kind: content 
  displayLabel: "Daily consumed vs burned calories" 
  direction: vertical 
  contentPadding: thick 
  flexCenter.showBorderSet: ["top", "bottom", "left", "right"] 
  flexCenter.showPaddingSet: ["top", "bottom", "left", "right"] 
  flexCenter.padding: thick
  flexCenter.gridLayouts: [ConsumedVsBurned.BarChartLayout]

// layout, content, LayoutReport
ensure layout LayoutReport kind: content direction: vertical contentPadding: thick
  start.formLayouts: [
    LayoutWater, 
    LayoutFood, 
    LayoutExercise, 
    LayoutSleep, 
    LayoutCalories
  ]

d. ReportWaterActivity

ensure report ReportWaterActivity kind: query 
  modules: ["MyFitnessPal"] 
  inputForm: FilterDashboard 
  outputForm: OutputDashboard 
  fromSpreadsheets: [FitnessSheet] 
  neoQL: "SELECT
    ${ss:FitnessSheet.Details.Date} as ${out:WaterIntake.Date},
    SUM(${ss:FitnessSheet.Water.Intake}) as ${out:WaterIntake.TotalIntake}
  FROM ${ss}
  WHERE ${ctx:row.type} = ${ss:FitnessSheet}
    AND ${in:Details.From} <= ${ss:FitnessSheet.Details.Date}
    AND ${in:Details.To} > ${ss:FitnessSheet.Details.Date} 
    AND ${ss:FitnessSheet.Details.Activity.optionId} = 'keyWater' 
  GROUP BY ${ss:FitnessSheet.Details.Date}
  ORDER BY ${ss:FitnessSheet.Details.Date} ASC
  LIMIT 7"

e. ReportFoodActivity

ensure report ReportFoodActivity kind: query 
  modules: ["MyFitnessPal"] 
  inputForm: FilterDashboard 
  outputForm: OutputDashboard 
  fromSpreadsheets: [FitnessSheet] 
  neoQL: "SELECT
    ${ss:FitnessSheet.Details.Date} as ${out:ConsumedCalories.Date},
    SUM(${ss:FitnessSheet.Food.TotalCalories}) as ${out:ConsumedCalories.TotalCaloriesCount}
  FROM ${ss}
  WHERE ${ctx:row.type} = ${ss:FitnessSheet}
    AND ${in:Details.From} <= ${ss:FitnessSheet.Details.Date}
    AND ${in:Details.To} > ${ss:FitnessSheet.Details.Date}
    AND ${ss:FitnessSheet.Details.Activity.optionId} = 'keyFood' 
  GROUP BY ${ss:FitnessSheet.Details.Date}
  ORDER BY ${ss:FitnessSheet.Details.Date} ASC
  LIMIT 7"

f. ReportSleepActivity

ensure report ReportSleepActivity kind: query 
  modules: ["MyFitnessPal"] 
  inputForm: FilterDashboard 
  outputForm: OutputDashboard 
  fromSpreadsheets: [FitnessSheet] 
  neoQL: "SELECT
    ${ss:FitnessSheet.Sleep.From} as ${out:Sleep.Date},
    SUM(${ss:FitnessSheet.Sleep.TotalHours}) as ${out:Sleep.TotalHours}
  FROM ${ss}
  WHERE ${ctx:row.type} = ${ss:FitnessSheet}
    AND ${in:Details.From} <= ${ss:FitnessSheet.Sleep.From}
    AND ${in:Details.To} > ${ss:FitnessSheet.Sleep.To}
    AND ${ss:FitnessSheet.Details.Activity.optionId} = 'keySleep' 
  GROUP BY ${ss:FitnessSheet.Sleep.From}
  ORDER BY ${ss:FitnessSheet.Sleep.From} ASC"

g. ReportExerciseActivity

ensure report ReportExerciseActivity kind: query 
  modules: ["MyFitnessPal"] 
  inputForm: FilterDashboard 
  outputForm: OutputDashboard 
  fromSpreadsheets: [FitnessSheet] 
  neoQL: "SELECT
    ${ss:FitnessSheet.Details.Date} as ${out:BurnedCalories.Date},
    SUM(${ss:FitnessSheet.Exercise.BurnedCalories}) as ${out:BurnedCalories.TotalCaloriesBurned}
  FROM ${ss}
  WHERE ${ctx:row.type} = ${ss:FitnessSheet}
    AND ${in:Details.From} <= ${ss:FitnessSheet.Details.Date}
    AND ${in:Details.To} > ${ss:FitnessSheet.Details.Date}
    AND ${ss:FitnessSheet.Details.Activity.optionId} = 'keyExercise' 
  GROUP BY ${ss:FitnessSheet.Details.Date}
  ORDER BY ${ss:FitnessSheet.Details.Date} ASC
  LIMIT 7"

h. ConsumVsBurnReport

ensure report ReportConsumedVsBurnedCalories kind: query 
  modules: ["MyFitnessPal"] 
  inputForm: FilterDashboard 
  outputForm: OutputDashboard 
  fromSpreadsheets: [FitnessSheet] 
  neoQL: "With q1 as (
  SELECT
    ${ss:FitnessSheet.Details.Date} as `date`,
    SUM(${ss:FitnessSheet.Exercise.BurnedCalories}) as `burnedCalories`
  FROM ${ss}
  WHERE ${ctx:row.type} = ${ss:FitnessSheet}
    AND ${in:Details.From} <= ${ss:FitnessSheet.Details.Date}
    AND ${in:Details.To} > ${ss:FitnessSheet.Details.Date}
    AND ${ss:FitnessSheet.Details.Activity.optionId} = 'keyExercise' 
  GROUP BY ${ss:FitnessSheet.Details.Date}
  ORDER BY ${ss:FitnessSheet.Details.Date} ASC
  LIMIT 7
  ),
  q2 as (
  SELECT
    ${ss:FitnessSheet.Details.Date} as `date`,
    SUM(${ss:FitnessSheet.Food.TotalCalories}) as `consumedCalories`
  FROM ${ss}
  WHERE ${ctx:row.type} = ${ss:FitnessSheet}
    AND ${in:Details.From} <= ${ss:FitnessSheet.Details.Date}
    AND ${in:Details.To} > ${ss:FitnessSheet.Details.Date}
    AND ${ss:FitnessSheet.Details.Activity.optionId} = 'keyFood' 
  GROUP BY ${ss:FitnessSheet.Details.Date}
  ORDER BY ${ss:FitnessSheet.Details.Date} ASC
  LIMIT 7
  )

  SELECT
    q2.date as ${out:ConsumedVsBurned.Date},
    q2.consumedCalories as ${out:ConsumedVsBurned.ConsumedCalories},
    q1.burnedCalories as ${out:ConsumedVsBurned.BurnedCalories}
  FROM q1
  JOIN q2 ON q1.date = q2.date"

i. FitnessDashboard

ensure report FitnessDashboard kind: composite 
  modules: ["MyFitnessPal"] 
  inputForm: FilterDashboard 
  outputForm: OutputDashboard
  mergeReports: [
    ReportWaterActivity, 
    ReportFoodActivity, 
    ReportSleepActivity, 
    ReportExerciseActivity, 
    ReportConsumedVsBurnedCalories
  ]

Frontend

1. ActivityDashboard

ensure action ActivityDashboard kind: report
  modules: ["MyFitnessPal"]
  icon: "CategoryRounded"
  increaseAsideWidth: true
  report: FitnessDashboard
  outputFormContentLayout: LayoutReport

2. Group actions

Group these actions under a section named LastPass for easy access.

ensure group MyFitnessPal
  pinnedActions: [ActivityDashboard]
  pinnedActionSetMobile: [ActivityDashboard]
  actionPermission: {
      'ActivityDashboard': {
        'menuGroup': '2',
        'roles': [
          'Member'
        ]
      }
    }