Power BI Report Embbeded in mobile layout does not save edit changes

Hi Anonymous,
Thank you  for reaching out to the Microsoft fabric community forum.

I would  like to take a moment to thank you jaineshp for your active participation and the helpful solutions you have shared in the community forum. Your contributions truly make a difference.

In addition to jaineshp  solution, you can refer to this official document link, which may help resolve your issue.

https://learn.microsoft.com/en-us/javascript/api/overview/powerbi/mobile

Hope the above provided information help you resolve the issue, if you have any further concerns or queries, please feel free to reach out to us.

Best Regards,
Harshitha.

Thanks for the respose jaineshp ,

I Have gone throught the steps and confirmed that i have all the configurations that was mentioned, but i made some observations 

- With Mobile Layout with following config:

1) In View mode

const embedConfig = {
            type: 'report',
            id: reportId,
            embedUrl: embedUrl,
            accessToken: accessToken,
            tokenType: models.TokenType.Embed,
            viewMode:  models.ViewMode.View,
            permissions: models.Permissions.ReadWrite,
            settings: {
                layoutType:models.LayoutType.MobilePortrait
            }
};

i am able to view the report in mobile layout and have no option to edit

2) In Edit Mode

const embedConfig = {
            type: 'report',
            id: reportId,
            embedUrl: embedUrl,
            accessToken: accessToken,
            tokenType: models.TokenType.Embed,
            viewMode:  models.ViewMode.Edit,
            permissions: models.Permissions.ReadWrite,
            settings: {
                layoutType:models.LayoutType.MobilePortrait
            }
   };

the report does not load at all and the console log has some 400 Bad requests

Note: If i load the report in viewMode and then try to convert it to editMode i get the permission issue

- With Desktop mode 

1) With the below config we are able to achive edit mode

const embedConfig = {
            type: 'report',
            id: reportId,
            embedUrl: embedUrl,
            accessToken: accessToken,
            tokenType: models.TokenType.Embed,
            viewMode: models.ViewMode.Edit,
            permissions: models.Permissions.All,
            settings: {
                filterPaneEnabled: true,
                hideErrors: true
            },
            autoEmbedOnContentLoaded: false
        };

 The desktop view , no issues able to edit anything and save all works fine. But if i move to mobile view

 with this if i re-arrange the visuals and save, it persits but if we make any other changes like :color, value etc.. those are not getting saved.(also console shows some 400 Bad request on save)

Note: This is in embedded report and not in service.

Here is my settings on getting the accessToken for the report 

new GenerateTokenRequest(accessLevel: TokenAccessLevel.Edit, allowSaveAs: true);