fix: add translucent prop to CachedDataQueryProvider (DHIS2-18029) (#…

…1699)

translucent is optional and defaults to same value as before: true
In CachedDataQueryProvider, the translucent prop of the Layer component 
was always true caused flashing grey backgrounds when loading main maps-app
and its plugin in dashboard.

src/components/CachedDataQueryProvider.js

@@ -6,15 +6,20 @@ import React, { createContext, useContext } from 'react'
 
 const CachedDataQueryCtx = createContext({})
 
-const CachedDataQueryProvider = ({ query, dataTransformation, children }) => {
+const CachedDataQueryProvider = ({
+    query,
+    dataTransformation,
+    children,
+    translucent = true,
+}) => {
     const { data: rawData, ...rest } = useDataQuery(query)
     const { error, loading } = rest
     const data =
         rawData && dataTransformation ? dataTransformation(rawData) : rawData
 
     if (loading) {
         return (
-            <Layer translucent>
+            <Layer translucent={translucent}>
                 <CenteredContent>
                     <CircularLoader />
                 </CenteredContent>
@@ -43,6 +48,7 @@ CachedDataQueryProvider.propTypes = {
     children: PropTypes.node.isRequired,
     query: PropTypes.object.isRequired,
     dataTransformation: PropTypes.func,
+    translucent: PropTypes.bool,
 }
 
 const useCachedDataQuery = () => useContext(CachedDataQueryCtx)