Kendo React Treelist - Select/Deselect the checkboxes column's values' based on an external dropdown selection

I'm having a shared component TreeList, something like below: TreeList.jsx

<KendoTreeList
        style={getStyle()}
        tableProps=
        rowHeight={rowHeight}
        scrollable="virtual"
        data={processData()}
        expandField={EXPAND_FIELD}
        subItemsField={SUB_ITEMS_FIELD}
        onExpandChange={onExpandChange}
        sortable
        onSortChange={handleSortChange}
        sort={sort}
        columns={columnDefinitions}
        resizable
        onColumnResize={onColumnResize}
        rowRender={renderRow}
        dataItemKey={idField}
        columnMenuFilter={filter}
        onColumnMenuFilterChange={handleFilterChange}
        reorderable
        onColumnReorder={onColumnReorder}
        selectedField={selectedField}
        onSelectionChange={handleSelectionChange}
        onHeaderSelectionChange={handleHeaderSelectionChange}
      />

Which has the values accessed from the props and the methods for the checkboxes as implemented here in this demo: https://stackblitz.com/run/?file=app/main.jsx

Now, the selection and deselection are working fine in the normal scenario, but I'm unable to achieve this based on a value from an external dropdown. So, for example, I have an external dropdown with Option 1, Option 2, and Option 3. If the user has selected Option 1, the above component will receive its value as a prop from my Dropdown component, let's say selectedOption, and if I've selected few records on the treelist. Now, if I change my selection of the dropdown to Option 2, I wish that all the checkboxes should be deselected. I'm unable to achieve this.

Any suggestions will be helpful. TIA.