Protobuf configuration for Kafka UI

[ChampakD]

I have configured a Kafka topic with protobuf. The same I want to view in Kafka - UI. But the keys and values are not visible

This is my part of proto file :

message PKT1 {
bytes data = 1;
}
message PKT2 {
bytes data = 1;
}
message PKTS { // SMS bearer
bytes data = 1;
}
message PKTErr { // Error in parsing
bytes data = 1;
}

=============
This is my config.yml

properties:
# protobufFilesDir specifies root location for proto files (will be scanned recursively)
# NOTE: if 'protobufFilesDir' specified, then 'protobufFile' and 'protobufFiles' settings will be ignored
protobufFilesDir: "/kafka-ui/app"
# protobufMessageName is the default protobuf type that is used to deserialize
protobufFiles: /kafka-ui/app/events.proto
# the message's value if the topic is not found in protobufMessageNameByTopic.
protobufMessageName: EventInQ
# mapping of topic names to protobuf types, that will be used for VALUES serialization/deserialization
# optional
protobufMessageNameByTopic:
"pkt1": .in.sensel.events.PKT1
"pkt2": .in.sensel.events.PKT2
"pkts": .in.sensel.events.PKTS
"pktErr": .in.sensel.events.PKTErr

What is going wrong or what is missing?

[SamsadSajid]

Your messages have fields of type bytes. So, when Kafka-ui deserializes messages, they are in bytes as we can see from your screenshot.