@jigx/mdk/dist/template-app-1/screens/edit-expense-screen.js

Jigx Mobile Development Kit - SDK for building Jigx applications

import { CTX } from '../../src';
/**
 * Edit expense screen with update and delete capabilities.
 * Loads existing expense data and allows modification or removal.
 * @param app - Application builder instance
 * @returns Configured edit expense screen
 */
export function editExpenseScreen(app) {
    const screen = app.addScreen.default('edit-expense', 'Edit Expense');
    // Load current expense data
    const currentExpense = 'current-expense';
    screen.addDatasource.sqlite(currentExpense, 'dynamic')
        .entity('default/expenses')
        .query(/* sql */ `
      SELECT 
        id, 
        data,
        json_extract(data, '$.title') AS title,
        json_extract(data, '$.amount') AS amount,
        json_extract(data, '$.category') AS category,
        json_extract(data, '$.date') AS date,
        json_extract(data, '$.description') AS description
      FROM [default/expenses]
      WHERE id = @expenseId
      LIMIT 1
    `)
        .queryParameter('expenseId', '=@ctx.jig.inputs.expenseId')
        .isDocument()
        .jsonProperties('data');
    // Edit form with pre-populated values
    const form = screen.addControl.form({ instanceId: 'edit-expense-form' });
    form.addControl.textField({ instanceId: 'title' })
        .label('Title')
        .required(true)
        .value(CTX.datasources.expr(currentExpense, 'title'));
    form.addControl.numberField({ instanceId: 'amount' })
        .label('Amount')
        .required(true)
        .value(CTX.datasources.expr(currentExpense, 'amount'));
    // Category dropdown with current selection
    const categoryDropdown = form.addControl.dropdown({ instanceId: 'category', isRequired: true })
        .label('Category')
        .data({ datasourceId: 'data-expense-categories' })
        .value(CTX.datasources.expr(currentExpense, 'category'));
    categoryDropdown.item('=@ctx.current.item.id')
        .title('=@ctx.current.item.name')
        .value('=@ctx.current.item.id');
    form.addControl.datePicker({ instanceId: 'date', isRequired: true, mode: 'date' })
        .label('Date')
        .value(CTX.datasources.expr(currentExpense, 'date'));
    form.addControl.textField({ instanceId: 'description' })
        .label('Description')
        .isMultiline(true)
        .value(CTX.datasources.expr(currentExpense, 'description'));
    // Bottom panel actions
    const buttons = screen.bottomPanel.buttons(2);
    // Update expense button/action
    buttons.add.executeEntity('Update', 'sequential')
        .dynamicData('default/expenses', 'update')
        .data({
        id: CTX.datasources.expr('current-expense', 'id'), // Second param is field name, 
        title: '=@ctx.components.title.state.value',
        amount: '=@ctx.components.amount.state.value',
        category: '=@ctx.components.category.state.selected',
        date: '=@ctx.components.date.state.value',
        description: '=@ctx.components.description.state.value',
        timestamp: '=@ctx.solution.state.now'
    })
        .goBack('previous');
    // Delete expense button/action
    const deleteButton = buttons.add.confirm('Delete', 'sequential');
    deleteButton.modal({ text: 'Delete Expense?' })
        .confirmText('Delete')
        .cancelText('Cancel');
    deleteButton.onConfirmed.executeEntity()
        .dynamicData('default/expenses', 'delete')
        .data({
        id: CTX.datasources.expr(currentExpense, 'id')
    })
        .goBack('previous');
    return screen;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZWRpdC1leHBlbnNlLXNjcmVlbi5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3RlbXBsYXRlLWFwcC0xL3NjcmVlbnMvZWRpdC1leHBlbnNlLXNjcmVlbi50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQXNCLEdBQUcsRUFBd0IsTUFBTSxXQUFXLENBQUE7QUFFekU7Ozs7O0dBS0c7QUFDSCxNQUFNLFVBQVUsaUJBQWlCLENBQUMsR0FBdUI7SUFDdkQsTUFBTSxNQUFNLEdBQUcsR0FBRyxDQUFDLFNBQVMsQ0FBQyxPQUFPLENBQUMsY0FBYyxFQUFFLGNBQWMsQ0FBQyxDQUFBO0lBRXBFLDRCQUE0QjtJQUM1QixNQUFNLGNBQWMsR0FBRyxpQkFBaUIsQ0FBQTtJQUN4QyxNQUFNLENBQUMsYUFBYSxDQUFDLE1BQU0sQ0FBQyxjQUFjLEVBQUUsU0FBUyxDQUFDO1NBQ25ELE1BQU0sQ0FBQyxrQkFBa0IsQ0FBQztTQUMxQixLQUFLLENBQUMsU0FBUyxDQUFBOzs7Ozs7Ozs7Ozs7S0FZZixDQUFDO1NBQ0QsY0FBYyxDQUFDLFdBQVcsRUFBRSw0QkFBNEIsQ0FBQztTQUN6RCxVQUFVLEVBQUU7U0FDWixjQUFjLENBQUMsTUFBTSxDQUFDLENBQUE7SUFFekIsc0NBQXNDO0lBQ3RDLE1BQU0sSUFBSSxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLEVBQUUsVUFBVSxFQUFFLG1CQUFtQixFQUFFLENBQUMsQ0FBQTtJQUV4RSxJQUFJLENBQUMsVUFBVSxDQUFDLFNBQVMsQ0FBQyxFQUFFLFVBQVUsRUFBRSxPQUFPLEVBQUUsQ0FBQztTQUMvQyxLQUFLLENBQUMsT0FBTyxDQUFDO1NBQ2QsUUFBUSxDQUFDLElBQUksQ0FBQztTQUNkLEtBQUssQ0FBQyxHQUFHLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxjQUFjLEVBQUUsT0FBTyxDQUFDLENBQUMsQ0FBQTtJQUV2RCxJQUFJLENBQUMsVUFBVSxDQUFDLFdB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QU8sTUFBTSxDQUFBO0FBQ2YsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IEFwcGxpY2F0aW9uQnVpbGRlciwgQ1RYLCBEZWZhdWx0U2NyZWVuQnVpbGRlciB9IGZyb20gJy4uLy4uL3NyYydcblxuLyoqXG4gKiBFZGl0IGV4cGVuc2Ugc2NyZWVuIHdpdGggdXBkYXRlIGFuZCBkZWxldGUgY2FwYWJpbGl0aWVzLlxuICogTG9hZHMgZXhpc3RpbmcgZXhwZW5zZSBkYXRhIGFuZCBhbGxvd3MgbW9kaWZpY2F0aW9uIG9yIHJlbW92YWwuXG4gKiBAcGFyYW0gYXBwIC0gQXBwbGljYXRpb24gYnVpbGRlciBpbnN0YW5jZVxuICogQHJldHVybnMgQ29uZmlndXJlZCBlZGl0IGV4cGVuc2Ugc2NyZWVuXG4gKi9cbmV4cG9ydCBmdW5jdGlvbiBlZGl0RXhwZW5zZVNjcmVlbihhcHA6IEFwcGxpY2F0aW9uQnVpbGRlcik6IERlZmF1bHRTY3JlZW5CdWlsZGVyIHtcbiAgY29uc3Qgc2NyZWVuID0gYXBwLmFkZFNjcmVlbi5kZWZhdWx0KCdlZGl0LWV4cGVuc2UnLCAnRWRpdCBFeHBlbnNlJylcblxuICAvLyBMb2FkIGN1cnJlbnQgZXhwZW5zZSBkYXRhXG4gIGNvbnN0IGN1cnJlbnRFeHBlbnNlID0gJ2N1cnJlbnQtZXhwZW5zZSdcbiAgc2NyZWVuLmFkZERhdGFzb3VyY2Uuc3FsaXRlKGN1cnJlbnRFeHBlbnNlLCAnZHluYW1pYycpXG4gICAgLmVudGl0eSgnZGVmYXVsdC9leHBlbnNlcycpXG4gICAgLnF1ZXJ5KC8qIHNxbCAqL2BcbiAgICAgIFNFTEVDVCBcbiAgICAgICAgaWQsIFxuICAgICAgICBkYXRhLFxuICAgICAgICBqc29uX2V4dHJhY3QoZGF0YSwgJyQudGl0bGUnKSBBUyB0aXRsZSxcbiAgICAgICAganNvbl9leHRyYWN0KGRhdGEsICckLmFtb3VudCcpIEFTIGFtb3VudCxcbiAgICAgICAganNvbl9leHRyYWN0KGRhdGEsICckLmNhdGVnb3J5JykgQVMgY2F0ZWdvcnksXG4gICAgICAgIGpzb25fZXh0cmFjdChkYXRhLCAnJC5kYXRlJykgQVMgZGF0ZSxcbiAgICAgICAganNvbl9leHRyYWN0KGRhdGEsICckLmRlc2NyaXB0aW9uJykgQVMgZGVzY3JpcHRpb25cbiAgICAgIEZST00gW2RlZmF1bHQvZXhwZW5zZXNdXG4gICAgICBXSEVSRSBpZCA9IEBleHBlbnNlSWRcbiAgICAgIExJTUlUIDFcbiAgICBgKVxuICAgIC5xdWVyeVBhcmFtZXRlcignZXhwZW5zZUlkJywgJz1AY3R4LmppZy5pbnB1dHMuZXhwZW5zZUlkJylcbiAgICAuaXNEb2N1bWVudCgpXG4gICAgLmpzb25Qcm9wZXJ0aWVzKCdkYXRhJylcblxuICAvLyBFZGl0IGZvcm0gd2l0aCBwcmUtcG9wdWxhdGVkIHZhbHVlc1xuICBjb25zdCBmb3JtID0gc2NyZWVuLmFkZENvbnRyb2wuZm9ybSh7IGluc3RhbmNlSWQ6ICdlZGl0LWV4cGVuc2UtZm9ybScgfSlcblxuICBmb3JtLmFkZENvbnRyb2wudGV4dEZpZWxkKHsgaW5zdGFuY2VJZDogJ3RpdGxlJyB9KVxuICAgIC5sYWJlbCgnVGl0bGUnKVxuICAgIC5yZXF1aXJlZCh0cnVlKVxuICAgIC52YWx1ZShDVFguZGF0YXNvdXJjZXMuZXhwcihjdXJyZW50RXhwZW5zZSwgJ3RpdGxlJykpXG5cbiAgZm9ybS5hZGRDb250cm9sLm51bWJlckZpZWxkKHsgaW5zdGFuY2VJZDogJ2Ftb3VudCcgfSlcbiAgICAubGFiZWwoJ0Ftb3VudCcpXG4gICAgLnJlcXVpcmVkKHRydWUpXG4gICAgLnZhbHVlKENUWC5kYXRhc291cmNlcy5leHByKGN1cnJlbnRFeHBlbnNlLCAnYW1vdW50JykpXG5cbiAgLy8gQ2F0ZWdvcnkgZHJvcGRvd24gd2l0aCBjdXJyZW50IHNlbGVjdGlvblxuICBjb25zdCBjYXRlZ29yeURyb3Bkb3duID0gZm9ybS5hZGRDb250cm9sLmRyb3Bkb3duKHsgaW5zdGFuY2VJZDogJ2NhdGVnb3J5JywgaXNSZXF1aXJlZDogdHJ1ZSB9KVxuICAgIC5sYWJlbCgnQ2F0ZWdvcnknKVxuICAgIC5kYXRhKHsgZGF0YXNvdXJjZUlkOiAnZGF0YS1leHBlbnNlLWNhdGVnb3JpZXMnIH0pXG4gICAgLnZhbHVlKENUWC5kYXRhc291cmNlcy5leHByKGN1cnJlbnRFeHBlbnNlLCAnY2F0ZWdvcnknKSlcblxuICBjYXRlZ29yeURyb3Bkb3duLml0ZW0oJz1AY3R4LmN1cnJlbnQuaXRlbS5pZCcpXG4gICAgLnRpdGxlKCc9QGN0eC5jdXJyZW50Lml0ZW0ubmFtZScpXG4gICAgLnZhbHVlKCc9QGN0eC5jdXJyZW50Lml0ZW0uaWQnKVxuXG4gIGZvcm0uYWRkQ29udHJvbC5kYXRlUGlja2VyKHsgaW5zdGFuY2VJZDogJ2RhdGUnLCBpc1JlcXVpcmVkOiB0cnVlLCBtb2RlOiAnZGF0ZScgfSlcbiAgICAubGFiZWwoJ0RhdGUnKVxuICAgIC52YWx1ZShDVFguZGF0YXNvdXJjZXMuZXhwcihjdXJyZW50RXhwZW5zZSwgJ2RhdGUnKSlcblxuICBmb3JtLmFkZENvbnRyb2wudGV4dEZpZWxkKHsgaW5zdGFuY2VJZDogJ2Rlc2NyaXB0aW9uJyB9KVxuICAgIC5sYWJlbCgnRGVzY3JpcHRpb24nKVxuICAgIC5pc011bHRpbGluZSh0cnVlKVxuICAgIC52YWx1ZShDVFguZGF0YXNvdXJjZXMuZXhwcihjdXJyZW50RXhwZW5zZSwgJ2Rlc2NyaXB0aW9uJykpXG5cbiAgLy8gQm90dG9tIHBhbmVsIGFjdGlvbnNcbiAgY29uc3QgYnV0dG9ucyA9IHNjcmVlbi5ib3R0b21QYW5lbC5idXR0b25zKDIpXG4gIFxuICAvLyBVcGRhdGUgZXhwZW5zZSBidXR0b24vYWN0aW9uXG4gIGJ1dHRvbnMuYWRkLmV4ZWN1dGVFbnRpdHkoJ1VwZGF0ZScsICdzZXF1ZW50aWFsJylcbiAgICAuZHluYW1pY0RhdGEoJ2RlZmF1bHQvZXhwZW5zZXMnLCAndXBkYXRlJylcbiAgICAuZGF0YSh7XG4gICAgICBpZDogQ1RYLmRhdGFzb3VyY2VzLmV4cHIoJ2N1cnJlbnQtZXhwZW5zZScsICdpZCcpLCAvLyBTZWNvbmQgcGFyYW0gaXMgZmllbGQgbmFtZSwgXG4gICAgICB0aXRsZTogJz1AY3R4LmNvbXBvbmVudHMudGl0bGUuc3RhdGUudmFsdWUnLFxuICAgICAgYW1vdW50OiAnPUBjdHguY29tcG9uZW50cy5hbW91bnQuc3RhdGUudmFsdWUnLFxuICAgICAgY2F0ZWdvcnk6ICc9QGN0eC5jb21wb25lbnRzLmNhdGVnb3J5LnN0YXRlLnNlbGVjdGVkJyxcbiAgICAgIGRhdGU6ICc9QGN0eC5jb21wb25lbnRzLmRhdGUuc3RhdGUudmFsdWUnLFxuICAgICAgZGVzY3JpcHRpb246ICc9QGN0eC5jb21wb25lbnRzLmRlc2NyaXB0aW9uLnN0YXRlLnZhbHVlJyxcbiAgICAgIHRpbWVzdGFtcDogJz1AY3R4LnNvbHV0aW9uLnN0YXRlLm5vdydcbiAgICB9KVxuICAgIC5nb0JhY2soJ3ByZXZpb3VzJylcblxuICAvLyBEZWxldGUgZXhwZW5zZSBidXR0b24vYWN0aW9uXG4gIGNvbnN0IGRlbGV0ZUJ1dHRvbiA9IGJ1dHRvbnMuYWRkLmNvbmZpcm0oJ0RlbGV0ZScsICdzZXF1ZW50aWFsJylcbiAgZGVsZXRlQnV0dG9uLm1vZGFsKHsgdGV4dDogJ0RlbGV0ZSBFeHBlbnNlPycgfSlcbiAgICAuY29uZmlybVRleHQoJ0RlbGV0ZScpXG4gICAgLmNhbmNlbFRleHQoJ0NhbmNlbCcpXG4gIGRlbGV0ZUJ1dHRvbi5vbkNvbmZpcm1lZC5leGVjdXRlRW50aXR5KClcbiAgICAuZHluYW1pY0RhdGEoJ2RlZmF1bHQvZXhwZW5zZXMnLCAnZGVsZXRlJylcbiAgICAuZGF0YSh7XG4gICAgICBpZDogQ1RYLmRhdGFzb3VyY2VzLmV4cHIoY3VycmVudEV4cGVuc2UsICdpZCcpXG4gICAgfSlcbiAgICAuZ29CYWNrKCdwcmV2aW91cycpXG5cbiAgcmV0dXJuIHNjcmVlblxufSJdfQ==