gistfile1.txt

<div>
  <div style="padding-bottom: 10px">
    <button id="refreshButton" class="btn btn-default" aria-label="Refresh">
      <span class="glyphicon glyphicon-refresh" aria-hidden="true"/> Refresh
    </button>
  </div>
  <table id="table"></table>
  <div id="pagination"></div>
  <form id="addForm" class="form-inline">
    <div class="form-group">
      <label for="employeeNameTextBox">Employee name</label>
      <input id="employeeNameTextBox" type="text" class="form-control" placeholder="John Doe">
    </div>
    <div class="form-group">
      <label for="skillNamesTagsInput">Skills</label>
      <input id="skillNamesTagsInput" type="text" class="form-control">
    </div>
    <button id="addButton" class="btn btn-success" type="submit" aria-label="Add">
      <span class="glyphicon glyphicon-plus" aria-hidden="true"/> Add
    </button>
  </form>
</div>

@Templated
public class EmployeeListPanel implements IsElement {

    private Integer tenantId = -1;

    @Inject @DataField
    private Button refreshButton;

    @Inject @DataField
    private TextBox employeeNameTextBox;
    @Inject @DataField
    private MVTagsInput skillNamesTagsInput;
    private List<Skill> skillTagsInputValues;
    @Inject @DataField
    private Button addButton;

    // TODO use DataGrid instead
    @DataField
    private CellTable<Employee> table;
    @DataField
    private Pagination pagination;

    private SimplePager pager = new SimplePager();
    private ListDataProvider<Employee> dataProvider = new ListDataProvider<>();

    public EmployeeListPanel() {
        table = new CellTable<>(15);
        table.setBordered(true);
        table.setCondensed(true);
        table.setStriped(true);
        table.setHover(true);
        table.setHeight("100%");
        table.setWidth("100%");
        pagination = new Pagination();
    }

    @PostConstruct
    protected void initWidget() {
        initTable();
    }

    @EventHandler("refreshButton")
    public void refresh(ClickEvent e) {
        refresh();
    }

    public void refresh() {
        refreshSkillsListBox();
        refreshTable();
    }

    private void refreshSkillsListBox() {
        SkillRestServiceBuilder.getSkillList(tenantId, new FailureShownRestCallback<List<Skill>>() {
            @Override
            public void onSuccess(List<Skill> skillList) {
                skillTagsInputValues = skillList;
//                requiredSkillListBox.clear();
//                skillList.forEach(skill -> requiredSkillListBox.addItem(skill.getName()));
            }
        });
    }

    private void initTable() {
        table.addColumn(new TextColumn<Employee>() {
            @Override
            public String getValue(Employee employee) {
                return employee.getName();
            }
        }, "Name");
        table.addColumn(new TextColumn<Employee>() {
            @Override
            public String getValue(Employee employee) {
                List<EmployeeSkillProficiency> skillProficiencyList = employee.getSkillProficiencyList();
                if (skillProficiencyList == null) {
                    return "";
                }
                return skillProficiencyList.stream().map(skillProficiency -> skillProficiency.getSkill().getName())
                        .collect(Collectors.joining(", "));
            }
        }, "Skills");
        Column<Employee, String> deleteColumn = new Column<Employee, String>(new ButtonCell(IconType.REMOVE, ButtonType.DANGER, ButtonSize.SMALL)) {
            @Override
            public String getValue(Employee employee) {
                return "Delete";
            }
        };
        deleteColumn.setFieldUpdater((index, employee, value) -> {
            EmployeeRestServiceBuilder.removeEmployee(tenantId, employee.getId(), new FailureShownRestCallback<Boolean>() {
                @Override
                public void onSuccess(Boolean removed) {
                    refreshTable();
                }
            });
        });
        table.addColumn(deleteColumn, "Actions");

        table.addRangeChangeHandler(event -> pagination.rebuild(pager));

        pager.setDisplay(table);
        pagination.clear();
        dataProvider.addDataDisplay(table);
    }

    private void refreshTable() {
        EmployeeRestServiceBuilder.getEmployeeList(tenantId, new FailureShownRestCallback<List<Employee>>() {
            @Override
            public void onSuccess(List<Employee> employeeList) {
                dataProvider.setList(employeeList);
                dataProvider.flush();
                pagination.rebuild(pager);
            }
        });
    }

    @EventHandler("addButton")
    public void add(ClickEvent e) {
        String employeeName = employeeNameTextBox.getValue();
        employeeNameTextBox.setValue("");
        employeeNameTextBox.setFocus(true);
//        int requiredSkillIndex = requiredSkillListBox.getSelectedIndex();
//        Skill requiredSkill = requiredSkillIndex < 0 ? null : skillListBoxValues.get(requiredSkillIndex);

        EmployeeRestServiceBuilder.addEmployee(tenantId, new Employee(tenantId, employeeName), new FailureShownRestCallback<Long>() {
            @Override
            public void onSuccess(Long employeeId) {
                refreshTable();
            }
        });
    }

}