Microsoft Teams modify Save button in Connector setup page - reactjs

I am currently working on the setup page for my custom MS Teams Connector.
For inspiration, I was looking into other companies and one particular thing caught my attention.
Teams usually has at the bottom 2 buttons, like here in my setup page:
I have no Problem communicating with them using the #microsoft/teams-js client SKD and could make my page work like it is now. But I got curious how to do it with custom buttons like other Companies.
For example Trello:
Like you can see they moved the buttons up and also have a login button.
I also need to add authentication form my Connector, so I was wondering if its possible to archive a similar layout for my Connector.
For the Setup page I am using web app created with create react app
So my questions are:
Is this possible using react?
If yes how is it done?
I could not find much documentation regarding this topic.

The behavior is by design. Quite a while back we started giving developers more control in the tab configuration flow and allow them to render their own button within the iframe. Everything within that task module is now controlled by the app.

Related

Provide MS Teams chat functionality in custom tab

I am building a custom application for microsoft teams. Where I want to have a tab with Chat functionality in it. Is it possible to have chat feature inside custom app tab ?
If yes, can someone provide step by step guideline for that?
Currently for personal tabs, there is no option to have a tab with Chat functionality in it.
we recommend you to raise a Teams UserVoice hereĀ if this needs to be consider as a future request.
But When a custom tab is added to a channel, a Tab conversation is created that allows team members to have focused discussions about the content as shown in below.

is it possible to create react app and deploy in sharepoint online without creating as web part?

has anyone worked with react and sharepoint, please tell me, if there any reference for creating a react app and deploy in sharepoint online directly, many of the references are creating react app as web part, but I cant find what I looking for. please help
It actually depends on where you want your application to show up in the SharePoint.
In addition to the WebParts, there is AppCustomizer option that allows you to show your app in one dedicated the placeholder of the sharepoint site (top or bottom):
https://learn.microsoft.com/en-us/sharepoint/dev/spfx/extensions/get-started/using-page-placeholder-with-extensions
Other that, there is "single page part" option that allows you app to occupy all the space on the page, and to be the only thing the user gets basically:
https://learn.microsoft.com/en-us/sharepoint/dev/spfx/web-parts/single-part-app-pages?tabs=pnpposh

React HTML point and click generator

I want users to be able to design a simple web page to render their content on a page on my site. Are there any projects (ideally react) out there currently that allow a point and click layout design similar to wordpress and generate html?
I have since found the Ory Editor - Seems to fulfil all my requirements.
https://github.com/ory/editor

Referencing Another App

What is the best way to reference another app in the visual query designer?
I am using the blog app and I created a second app to list the tags that are used in the main blog app. This way when the app goes to a detail page of a post, I can still have the tags listed on the website without the view changing automatically. I set up my blog tags app with a visual query that list all of the tags used in the main app. Everything was working fine in development.
The problem that I have run into is that when I move the app to a production site the AppId was different than the one I was currently using and development. Now, the tags app is showing an error and I am not able to get into the settings to change the app ID of the visual query to the proper one in order to get the information needed. Is there a better way that I should be handling this?
This sounds like the right way to do it - your main issues is getting into the admin-ui when the template you have shows an error.
I suggest that you quickly rename your current template (so it's not used till you fix the bug) and create an empty template with the original name. This way you can go to the normal settings.
Another option is to switch into dnn-edit-mode, and use the black-dnn buttons to get to app-admin.

Salesforce: Adding items to 'Personal Setup' and 'Customize'

I am writing a simple salesforce app that requires app-level and user-level configuration. I have created custom objects for these settings, but cannot figure out how to add links to the Setup page (Personal Setup and Customize) so that the settings can be managed.
Quite a lot of research, and a question on a salesforce board, have left me none the wiser. I have seen a couple of scripts on the web that hack the setup sidebar with javascript (eg http://userscripts.org/scripts/show/95361) ... but this can't be the right way to do it surely?
Thanks
Jim
You are unable to do this without hacking because Salesforce want it so that you don't require over-explicit setup of any app you create - they want you to make it data-independent and in fact it may fail a security review if it is data dependent. It will also likely cause you headaches in correctly unit testing the app.
My suggestion would be to have a set of custom pages which are linked to on the home page for a user which display if they have no current values (so the first thing they see on the home page when they login for the first time is a "Hey, before you use this app you need to do some configuration through this handy wizard" and then block access to other areas of the app (i.e. display warning messages on other pages) if the app has not had this data setup.
That way you are not hacking and are providing a nice user experience around the extra setup.
Paul
DO you just want to add a new TAB on the top menu that links to the Edit page for your new sObject?
If so:
Goto setup https://cs3.salesforce.com/ui/setup/Setup
Click on 'Create' > 'Tab'
Pick the sObject you want the tab edit, the click next until you save the new tab.
There is no supported way to augment the Setup menu.
You should probably be using Custom Settings for what you are describing - they were designed for app-level and user-level configuration, and are available from Setup.
Otherwise, if it really is custom setup that requires fancier logic / UI / etc, you may want to do what many SFDC ISV's do and ship your app with its own configuration tab that's hidden, and/or custom VF page that manages app settings.

Resources