How to send selection nodes name to app.tsx

[PepperKUN]

Hello, I am now in a situation of how to return the node name string selected by figma to the App.tsx page. So far, it seems that I can only handle this string information in the class under messages.
What if I want to return these strings to App.tsx and use setState to refresh the display of the page.
How should it be done according to the current structure?

[PepperKUN]

import * as Networker from "monorepo-networker";
import { NetworkSide } from "../sides";
import { keyframe } from "../../../type/types";

interface Payload {
  keyframes: {
    [key:string]: keyframe[]
  };
  allowPlay: boolean;
}

export class SelectionMessage extends Networker.MessageType<Payload> {

  receivingSide(): Networker.Side {
    return NetworkSide.UI;
  }

  handle(payload: Payload) {
    //can only resolve the message here ↓↓↓
    console.group('selection')
    console.log(payload.allowPlay)
    console.table(payload.keyframes);
    console.groupEnd()
  }
}

[iGoodie]

Hey there! 😄

In theory, you can use a global store library (like Redux or Zustand) to store your data globally and initiate state updates outside a React component. Theoretically it'd look like so:

• plugin/plugin.ts

    figma.on("selectionchange", () => {
      const { selection } = figma.currentPage;

      NetworkMessages.SELECTION_CHANGED.send({
        selection: selection.map((selection) => ({
          id: selection.id,
          boundingBox: selection.absoluteBoundingBox,
        })),
      });
    });

• common/network/messages/SelectionMessage.ts

import { store } from "/path/to/createdStore";

interface Payload {
  selection: {
    id: string;
    boundingBox: Rect | null;
  }[];
}

export class SelectionMessage extends Networker.MessageType<Payload> {
  receivingSide(): Networker.Side<any> {
    return NetworkSide.UI;
  }

  handle(payload: Payload): void {
    store.dispatch({
      type: "SELECT",
      payload,
    });
  }
}

[iGoodie]

I might also want to support arbitrary subscriptions to the messages too.
I'll include this under https://github.com/CoconutGoodie/monorepo-networker as a feature request 😄

[PepperKUN]

Thank you, using a global store library is better than my current method. I'll try this way to assign data from figma to plugin page. I also looking forward to the new feature, it seems to make the code concise and elegant. 😍