Adding functionality to nRF Connect Desktop Bluetooth Low Energy App

[ThienVu]

Hello,

Currently I would like to add a functionality to Bluetooth Low Energy App (BLE). I have a bluetooth slave device that require a specific sequence of sending string and receiving notification string to setup. I use a nRF52840 USB Dongle as an adapter to connect to those slave devices.

I would like to add a button/option to the red area above to automate the configuration sequence. This includes sending a byte to specific service, receive notification from specific service. Where should I start? The examples on the nRF Connect Desktop app development page didn't help, and the documentation is not enough.

Thank you.

[Joakim Jakobsen]

Hi.

Talked to one of our developers;

You can start from here:
https://nordicsemiconductor.github.io/pc-nrfconnect-docs/

And then get the existing BLE app following the example here:
https://nordicsemiconductor.github.io/pc-nrfconnect-docs/get_an_existing_app_s_sources

The BLE source is at:
https://github.com/NordicSemiconductor/pc-nrfconnect-ble

Just can just find the place you would like to update and change it.

If you need more information, let me know and I'll forward your questions to our developers.

Br,
Joakim

[ThienVu]

Hello,

I've looked at the source code and was able to render a button and assigned a logger.info() in ConnectedDevice Component and DeviceDetails Component.

I also found the writeCharacteristic(characteristic, value) in deviceDetailActions, that corresponds to my needs. However, how do I call this function the correct way. I tried this in DeviceDetails Component but didn't work. onPairDevice is the extra function I want. I only post the part that I changed in each Component:

const DeviceDetailsView = ({
    device,
    [snipped]
    onPairDevice,
})

<ConnectedDevice
                id={`${instanceId}_details`}
                sourceId={`${adapter.instanceId}_details`}
                [snipped]
                onPairDevice={writeCharacteristic('1234', 0x22)}
            />
            
DeviceDetailsView.propTypes = {
    device: PropTypes.object.isRequired,
    [snipped]
    onPairDevice: PropTypes.func.isRequired,
};

this is in ConnectedDevice Component:

const ConnectedDevice = ({
    id,
    [snipped]
    onPairDevice,
}) => {

const onSelect = eventKey => {
        switch (eventKey) {
            case 'Disconnect':
                onDisconnect();
                break;
            [snipped]
            case 'pairDevice':
                onPairDevice();
                break;
            default:
                console.log('Unknown eventKey received:', eventKey);
        }
    };
    
    
    ConnectedDevice.propTypes = {
    id: PropTypes.string.isRequired,
    [snipped]
    onPairDevice: PropTypes.func.isRequired,
};

[ThienVu]

Can someone please help? I'm very close now and only need a little push

[Joakim Jakobsen]

Some feedback from our developers:

The correct way to implement the function is to 

1. Write the function, like calling deviceDetailActions and put it in a file in lib/actions
2. Create a container under lib/containers which pass the function to the component
3. Import the function into the component and use it

So it is using React and Redux framework. And in redux you use dispatch() to trigger the actions and change the states. So furthermore, if you need to manage the states, you have to create a file under reducers to manage the state and put it in container so that component can update it whenever the state has been updated.

Br,
Joakim

[ThienVu]

Thank you.

I looked at the writeCharacteristic function and noticed that it already have dispatch() in there, so I'm thinking it is called just like a regular function when needed, and it will dispatch the appropriate action accordingly. I think my problem is maybe I'm using the wrong function to do what I want.

Sorry for asking many questions. There isn't much documentation for nrf connect apps that I can find.