List-Formatting
List-Formatting copied to clipboard
New sample because a document library in aTeams tab doesn't load URLs properly for .url items.
Sample (which sample are you talking about)
I'm talking about a new sample using the 'Name' column in document libraries.
Suggestion (the more details, the better)
Currently, when you click on a .url 'file' in a Teams tab, the URL doesn't load and nothing happens. I'd love to suggest that be patched, but in the meantime, I wrote a column format for the Name column in document library that behaves and looks normal for all other files types, but if the file extension ends with '.url', it loads a standard tag that looks the same in the library but loads the correct shortcut URL in a new browser window with the href attribute and target is _blank. Testing indicates this works pretty well and overrides the default buggy behaviour in a Teams tab, without affecting anything else, if even looks the same.
The list of classes is just the default list of classes for a document library's Name column, so it looks and behaves the same as an ordinary name column in a document library. If you think I should post this bug somewhere Microsoft devs can see it, I'm happy to do that as well, but in the meantime, this is my fix.
Here is the formatting:
{ "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json", "elmType": "div", "children": [ { "elmType": "a", "attributes": { "class": "ms-Link root_137a7565 nameField_c45bee6b clickable_c45bee6b overflow_85ed223c pre_85ed223c", "href": "[$_ShortcutUrl]", "target": "_blank" }, "style": { "display": "=if(endsWith([$FileLeafRef], '.url'), 'grid', 'none'", "vertical-align": "middle" }, "txtContent": "[$FileLeafRef]" }, { "elmType": "button", "attributes": { "class": "ms-Link root_137a7565 nameField_c45bee6b clickable_c45bee6b overflow_85ed223c pre_85ed223c" }, "style": { "display": "=if(endsWith([$FileLeafRef], '.url'), 'none', 'grid'", "vertical-align": "middle" }, "txtContent": "[$FileLeafRef]", "customRowAction": { "action": "defaultClick" } } ] }
@robAttrell
Just tested in Microsoft Teams File tab and WOW! 👍
@Fedes365 yeah I've been playing with it more and seems indistinguishable from the standard formatting, but it works in Teams. Does this make sense as a sample, I figured I should try to share since it means you can actually use the '.url' functionality in a document library as it seems like it must be intended to work.
I also wanted to actually test the process of making sample suggestions as I have a few more complex formatting examples that I'd be willing to contribute as samples if that's something that can be done this way.
@robAttrell In my point of view the sample process should follow the options that are described in official documentation and other MS articles related this topic. https://learn.microsoft.com/en-us/sharepoint/dev/declarative-customization/formatting-syntax-reference#fieldname I believe you a are using a internal field "$_ShortcutUrl", from the dataset value and that should be ok since value/metadata is being call, the only thing that have doubts is the Teams class, don't believe this is support from MS Lists or could not find documentation related and off course if MS changes this style, sample is broken. But could be a good catch from the Metadata info.
I totally agree the classes are not great in that they're not standard CSS, I guess you could call it lazy to say that I didn't look at each of those classes in the CSS, parse out what combination of CSS matches the look and feel of the name column those classes provide, and use that.
I would certainly be willing to go through that process and supply standard CSS/SharePoint classes to avoid breaking in possible future updates.
@robAttrell Here a list of the css you could use https://zerg00s.github.io/sp-modern-classes/