Code review comment for lp:~doflah/ubuntu-clock-app/empty_alarm_page

From a developer's perspective, please move the following code into a new file called "EmptyState.qml" in the components folder. This way we can reuse this code in other places if required.

15 + Item {
16 + visible: alarmModel.count === 0
17 + anchors.verticalCenter: parent.verticalCenter
18 + width: parent.width
19 + height: childrenRect.height
20 +
21 + Icon {
22 + id: noAlarmIcon
23 + name: "alarm-clock"
24 + anchors.horizontalCenter: parent.horizontalCenter
25 + height: units.gu(10)
26 + width: height
27 + color: UbuntuColors.warmGrey
28 + }
29 +
30 + Label {
31 + id: noAlarmLabel
32 + text: i18n.tr("No saved alarms")
33 + anchors.top: noAlarmIcon.bottom
34 + anchors.horizontalCenter: parent.horizontalCenter
35 + fontSize: "x-large"
36 + font.bold: true
37 + }
38 +
39 + Label {
40 + text: i18n.tr("Tap the plus icon to add an alarm.")
41 + anchors.top: noAlarmLabel.bottom
42 + anchors.horizontalCenter: parent.horizontalCenter
43 + fontSize: "large"
44 + }
45 + }

You will be obviously define some public properties like icon, title, subtitle etc to adjust these properties from outside.

So it should be used like,

EmptyState {
   id: alarmEmptyState

   visible: alarmModel.count === 0
   anchors.verticalCenter: parent.verticalCenter

   iconName: "alarm-clock"
   title: i18n.tr("No saved alarms")
   subtitle: i18n.tr("Tap the + icon to add an alarm.")
}