How to ask for screen recording permission in electron app in Mac OS?

Question

I am trying to create an app and ask for screen recording permission, but the app asks for permission if i directly execute desktopcapturer.getsources() function with the correct app name added.

Here is an example,

const sources = await desktopCapturer.getSources({
      types: ["screen"],
      thumbnailSize: { width: 1920, height: 1080 },
});

I also tried to use below but it was not adding my application name in the system preferences screen recording permissions window,

const permissionStatus: string =
      systemPreferences.getMediaAccessStatus("screen");

    // throwing error if no permission given
    if (permissionStatus !== "granted") {
      // Open Screen privacy settings in System Preferences
      shell.openExternal('x-apple.systempreferences:com.apple.preference.security?Privacy_ScreenCapture');
    
      // throw new Error("screen capture, access denied");
      console.log("Permission status ", permissionStatus);
    }

I want my app to show the following window when i start it or when my app does not have required permissions

But my app currently just opens the permission window without the name of my app added there as shown below,