Read file from device then display on settings page?

[eblohm]

I'm working on a clockface that creates some data based on movement and then saves it to a file. I'd like to display the information on the settings page of the clockface, is that possible?

So far, I'm able to read and write to the file on the device, and I can send a message with the data in the file to the index.js file in the companion folder. I've logged it to the console so I know index.js in companion is actually receiving the file.

My current settings file is very basic, because I just wanted to test it out before I got deep into writing it:

function mySettings(props) {
  return (
    <Section
      title={<Text bold align="center">Section Title</Text>}>
      <Text id="testing">Testing</Text>
    </Section>
  )
}

registerSettingsPage(mySettings);

and then in the index.js file from Companion

function changeSomething(json) {
  let test = document.getElementById("testing");
  test.text = testing.base_info;
}

messaging.peerSocket.onmessage = function(evt) {
  let json = JSON.stringify(evt.data);
  console.log("JSON " + json);
  changeSomething(json);
}

Am I just trying to do this in the wrong file? Is it even possible?

Thanks!

[Gondwana]

I suspect this may not work well, if only because the settings GUI is rather limited and not always dynamic.

Fundamentally, it's based on React rather than HTML or SVG, so it's a very different beast and requires a different approach to get it to react.

 Here's something from an app of mine:

let status = imageSelected? 'Ready to send' : '';
settingsStorage.setItem('status', JSON.stringify({'name':status}));

 Basically, if you change the underlying setting that the SVG is displaying, the UI should update automatically.