1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
=a!localVariables(
  /* In a real app, these values should be held in the database or in a constant */
  local!departments: { "Corporate", "Engineering", "Finance", "HR", "Professional Services", "Sales" },
  local!pagingInfo: a!pagingInfo(
    startIndex: 1,
    batchSize: 5,
    sort: a!sortInfo(field: "id", ascending: true)
  ),
  local!selectedDepartment,
  /*
  * local!datasubset is pulling data from the employee data store entity
  * from the entity backed record tutorial.
  *
  * To use your data, change the constant from cons!EMPLOYEE_ENTITY to one of
  * your own. Then replace the fields in the queryColumns to a
  * relevant datapoint from your data store entity
  */
  local!datasubset: a!refreshVariable(
    value: a!queryEntity(
      entity:cons!EMPLOYEE_ENTITY,
      query:a!query(
        selection: a!querySelection(columns: {
          a!queryColumn(field: "firstName"),
          a!queryColumn(field: "lastName"),
          a!queryColumn(field: "department"),
          a!queryColumn(field: "title"),
          a!queryColumn(field: "phoneNumber"),
          a!queryColumn(field: "startDate")
        }),
        filter: if(
          isnull(local!selectedDepartment),
          null,
          a!queryFilter(
            field: "department",
            operator: "=",
            value: local!selectedDepartment
          )
        ),
        pagingInfo: local!pagingInfo
      ),
      fetchTotalCount: true
    ),
    refreshInterval: 0.5
  ),
  local!lastUpdatedAt: a!refreshVariable(
    value: now(),
    /* Update whenever the value of local!datasubset changes */
    refreshOnVarChange: local!datasubset,
    /* Using the same timer as local!datasubset also shows   *
     * that the data is getting requeried every 30 seconds   *
     * even if the value of local!datasubset doesn't change  */
    refreshInterval: 0.5
  ),
  a!sectionLayout(
    contents:{
      a!richTextDisplayField(
        labelposition: "COLLAPSED",
        value: {
          a!richTextItem(
            text: {
              "Last updated at ",
              text(local!lastUpdatedAt, "h:mm a")
            },
            color: "SECONDARY",
            style: "EMPHASIS"
          )
        },
        align: "RIGHT"
      ),
      a!dropdownField(
        label:"Department",
        placeholderLabel: "All departments",
        choiceLabels: local!departments,
        choiceValues: local!departments,
        value: local!selectedDepartment,
        saveInto: local!selectedDepartment
      ),
      a!gridField(
        label:"Employees",
        data: local!datasubset,
        columns: {
          a!gridColumn(
            label: "First Name",
            sortField: "firstName",
            value: fv!row.firstName
          ),
          a!gridColumn(
            label: "Last Name",
            sortField: "lastName",
            value: fv!row.lastName
          ),
          a!gridColumn(
            label: "Department",
            sortField: "department",
            value: fv!row.department
          ),
          a!gridColumn(
            label: "Title",
            sortField: "title",
            value: fv!row.title
          ),
          a!gridColumn(
            label: "Phone Number",
            value: fv!row.phoneNumber
          ),
          a!gridColumn(
            label: "Start Date",
            sortField: "startDate",
            value: fv!row.startDate
          )
        },
        pagingSaveInto: local!pagingInfo,
        rowHeader: 1
      )
    }
  )
)