Posts

Showing posts with the label SPFX - React

SharePoint online hub navigation not updating for other users

Its been quite a time that I am working with SharePoint Online and meeting new challenges every day. Its feels great when you find a solution for something which Google do not tell you. I am just writing this post because there might be someone out there facing the same issue and this post might help him. BTW, before you check the actual post of how to fix the navigation check below, this might also help to change the user language. Problem Description: When an Admin of SharePoint Online site, updates the hub navigation (or may be site navigation), it do not get updated for all the users instantly. User has to clear browser cache to get the updated navigation. As per discussion with Microsoft, SharePoint saves a copy of the navigation in browser cache which automatically refreshes after a certain period of time. By default, you cannot clear browser cache using React or JS code. Browsers do not allow you to do so. So, the user should wait till that time? ABSOLUTELY NOT! (Imran Khan 😋 )...

RangeError: Maximum call stack size exceeded | Node JS | SPFX React

Image
I literally had no idea that my minor experiment can ruin my 10 hours in troubleshooting. However, at the end, you learn something new. I am currently developing a project in SPFX - React to build a customized portal for a client. Later today i modified a config file in the SPFX project called "config.json" to include a new script file. Everything worked perfect until I stopped the debugging and start it again after some time. When I ran Gulp Serve I start seeing below error when Node tried to start "webpack" await Promise.all(externalModule.globalDependencies.map(async (dependencyName) => { RangeError: Maximum call stack size exceeded and some other errors like below. This is probably not a problem with npm. There is likely additional logging output above. npm ERR ! A complete log of this run can be found in : Googled around and found few solutions like clearing NPM cache with  npm cache clean --force and deleting package-lock.json,  then ran npm install ag...

How to update preferred language (MUILanguages) in SharePoint Online using Power Automate

Image
This is pretty much something that I have not found in a direct way on internet so I thought I must write about it and make someone else's life easier someday. Scenario:  I have scenario where my customer has SharePoint Online portal with multilingual support and some custom developed web parts. During the development phase, the tenant was different and I was able to redirect user to MyAccount so he can change the preferred language,  but this setting was not available on customer's tenant. The reason was, we had Azure AD profiles while customer has synced them from local AD so this setting was not available. I recommend you to check out my this post about the language switch issue that I faced. Problem:   Since the manually preferred language change option was not available, we need to find another way where user can switch to any other language. In my case it was switch to Arabic from English. Solution Overview: Since the preferred way to make the language switch should...

Get SharePoint list items using PNP/SP - React in SPFX web part

Image
Hope this post finds you well. I have just started learning SPFX and and I found it pretty interesting using React. TypeScript is a whole new world than a legacy development technique. It gives you new ways to think and implement your code. Let start working and stop talking. Note: Before starting this article, it is assumed that you have already setup your environment  according to Microsoft's guidelines. This is very important that you read and perform all the installation steps carefully as if there will be a minor change in the installation software versions, you won't be able to do many operations later on. Steps that we'll do to achieve this task are below: Create solution and web part using YO. Install PNP/SP Create SharePoint list Write React and PNP code Test web part on workbench Lets start...!   ✌ 1. Create solution and web part using YO. First, lets create a solution and choose a web part to create. For this, create a folder in your drive with the project name. ...