SilicaListView {
        id: listView
        model: shelvesModel
        anchors.fill: parent
        spacing: Theme.paddingMedium
        header: PageHeader {
            title: qsTr("Bookshelves")
        }

        property Item contextMenu

        PullDownMenu {
            MenuItem {
                text: qsTr ("My Profile")
                visible: uid != "self"
                onClicked: switchToMyProfile ()
            }

            MenuItem {
                text: qsTr ("Add bookshelf")
                visible: true
                onClicked: switchToAddEditShelf ("", "", false);
            }

            MenuItem {
                text: qsTr ("Refresh")
                onClicked: refreshShelves (uid);
            }
        }


        ViewPlaceholder {
            enabled: !loading && (shelvesModel.count === 0)
            text: qsTr ("List of shelves is empty")
        }

        delegate: ListItem {
            id: delegate

            property bool menuOpen: listView.contextMenu != null &&
                    listView.contextMenu.parent === delegate

            height: menuOpen ?
                    listView.contextMenu.height + Theme.itemSizeMedium :
                    Theme.itemSizeMedium

            Label {
                id: shelfNameLabel
                anchors.left: parent.left
                anchors.leftMargin: Theme.paddingMedium
                anchors.verticalCenter: parent.verticalCenter
                text: shelfName === undefined ? "" : shelfName
                font.pixelSize: Theme.fontSizeLarge
                color: delegate.highlighted ? Theme.highlightColor : Theme.primaryColor
            }

            Label {
                id: booksCountLabel
                anchors.right: parent.right
                anchors.rightMargin: Theme.paddingMedium
                anchors.verticalCenter: parent.verticalCenter
                text: shelfBooksCount === undefined ? "0" : shelfBooksCount
                font.pixelSize: Theme.fontSizeLarge
                color: delegate.highlighted ? Theme.highlightColor : Theme.primaryColor
            }

            onClicked: console.log (shelfID)

            onPressAndHold: {
                if (!listView.contextMenu) {
                    listView.contextMenu = contextMenuComponent.createObject (listView)
                }
                listView.contextMenu.shelfId = shelfID;
                listView.contextMenu.shelfName = shelfName;
                listView.contextMenu.shelfExclusive = shelfExclusive;
                listView.contextMenu.show (delegate)
            }
        }

        Component {
            id: contextMenuComponent
            ContextMenu {
                property string shelfId;
                property string shelfName;
                property bool shelfExclusive;
                MenuItem {
                    visible: uid == "self"
                    text: qsTr ("Edit");
                    onClicked: switchToAddEditShelf (shelfId, shelfName, shelfExclusive)
                }
            }
        }

        VerticalScrollDecorator {}
    }