Expose Teams context from SPFx

[wobba]

Ensure search web part can work inside a teams tab and expose teams context as needed.

[Georg-Trixl]

yep, i like to have that as well 👍

[paalolav]

Having issues with files from Document Libraries in Teams.
When displaying search results on a Sharepoint page in a tab in Teams:
Pages open like expected, but files like PDF, Docx, etc opens the Document Library instead of the selected file from the search result.
Is this a bug or is it something I've done wrong?

Update:
[https://github.com//issues/343]

[wobba]

I'll most likely change the logic on how the open links look for the next version.

[paalolav]

I'll most likely change the logic on how the open links look for the next version.

Thanks for the reply and for the AWESOME job you're doing!
I solved it for now by adding ?web=1 to the search result URLs. Works like a charm for now.

[wobba]

@paalolav Made the change now - thanks for reminding me.

pnp-modern-search/search-parts/src/services/TemplateService/BaseTemplateService.tsx

Lines 187 to 189 in 22bcdf0

	if (!isEmpty(item.DefaultEncodingURL)) {
	url = item.DefaultEncodingURL + "?web=1";
	}

[sagar2610]

Hi Team, I downloaded the code and made some changes. It's great that you added "?web=1". I had an unique requirement where the users did not have access to application pages. Most of the files with "?web=1" are redirected to a custom file handler developed by Microsoft. So, when a user with no access to application pages tries to open the file, user gets access denied. To solve this issue I added a new setting in web part settings tab. Now users can choose to turn on or off the default behaviour. If defaultBehaviour is turned "On", links are displayed with "?web=1", if it is not enabled then direct links are displayed, which enables you to directly download the file. The user is not redirected to custom file handler and the file is not opened in the browser but gets downloaded.

[wobba]

Curious as to the scenario where a user can access a file, but not view it in the ODSP previewer? And did not think about this.

I would rather add an option to the getUrl helper, so people could override and change this in a custom template instead.

[sagar2610]

@wobba I made this change because Details list does not give you the option to change the template underneath (pnp-details-list/pnp-details-list). For other templates, I directly used the Path column instead in custom template. We are sharing our SharePoint site with external users and SharePoint shows a share button on top and all the external users can see other external users by clicking on Shared With tab. We do not want external users to see each other so, we had to restrict access to application pages (not a good way but need to wait for Microsoft).

[wobba]

@sagar2610 You can pick Details List, then click the {} to customize and it will copy that template over as a basis. Which is why I'd rather extend the helper.

[sagar2610]

@wobba

<style>
    /* Insert your CSS overrides here */
</style>

<div class="template_root">
    {{#if @root.hasPrimaryOrSecondaryResults}}   
        {{#if showResultsCount}}
            <div class="template_resultCount">
                <label class="ms-fontWeight-semibold">{{getCountMessage @root.paging.totalItemsCount keywords}}</label>
            </div>
        {{/if}}
        <pnp-details-list data-items="{{JSONstringify items}}" data-columns-configuration="{{JSONstringify detailsListColumns}}" data-show-file-icon="{{@root.showFileIcon}}" data-is-compact="{{@root.isCompact}}"></pnp-details-list>
        {{#if @root.paging.showPaging}}
            <pnp-pagination 
                data-total-items="{{@root.paging.totalItemsCount}}" 
                data-hide-first-last-pages="{{@root.paging.hideFirstLastPages}}"
                data-hide-disabled="{{@root.paging.hideDisabled}}"
                data-hide-navigation="{{@root.paging.hideNavigation}}"
                data-range="{{@root.paging.pagingRange}}" 
                data-items-count-per-page="{{@root.paging.itemsCountPerPage}}" 
                data-current-page-number="{{@root.paging.currentPageNumber}}"
            >
            </pnp-pagination>
        {{/if}}
    {{else}}
        {{#unless showBlank}}
            <div class="template_noResults">{{@root.strings.NoResultMessage}}</div>
        {{/unless }}
    {{/if}}
</div>

<style> /* Insert your CSS overrides here */ </style>

<div class="placeholder_root">
    {{#if showResultsCount}}
        <div class="template_resultCount">
            <span class="shimmer line" style="width: 20%"></span>
        </div>
    {{/if}}
    <pnp-details-list data-columns-configuration="{{JSONstringify @root.detailsListColumns}}" data-show-file-icon="{{@root.showFileIcon}}" data-is-compact="{{@root.isCompact}}" data-show-shimmers="true"></pnp-details-list>
</div>

It does not give me an option to modify the underlying URL behaviour.

[wobba]

Right, cause it's inside the details component which calls:

let url = Handlebars.helpers.getUrl(item);

I would then extend the component to have this as a setting and pass it down to getUrl and have that support it.

[sagar2610]

Exactly, just to get around it, I added some extra code. But you are right, extending the templates is the best idea. I am not good with handlebars so I took the hard way. Thanks a lot for your help.

[wobba]

Could you log a separate issue on this as an improvement? I might take a stab at it as it should be fairly easy to get in.

[sagar2610]

Here you go @wobba #464 (comment)

[wobba]

Teams support and context added