Theme and v2.4 problems

PowerShell Universal
1 
Product: PowerShell Universal
Version: 2.4

Since upgrading to v2.4, I get an error when my theme is applied. This theme has worked on prior versions and all that is reported is "Failed to get dashboard. Dashboard was null. Make sure to return a dashboard from your script. "

Here is my theme:
$Theme = @{

dark = @{

    palette = @{

        Common = @{

            black = '#000'

            white = '#fff'

        }

        primary = @{

            main         = '#42a5f5' #'rgba(157 222 255 / 90%);' #'#5c6bc0' #'#283593' #'#939b38'

            light        = '#5f5fc4' #'#7986cb'

            dark         = '#001064' #'#303f9f'

            contrastText = '#fff'

        }

        secondary = @{

            light        = '#6ec6ff' #'#ff4081'

            main         = '#2196f3" #' #f50057'

            dark         = '#0069c0' #'#c51162'

            contrastText = '#fff'

        }

        error  = @{

            light        = '#e57373'

            main         = '#f44336'

            dark         = '#d32f2f'

            contrastText = '#fff'

        }

        warning = @{

            light        = '#ffb74d'

            main         = '#ff9800'

            dark         = '#f57c00'

            contrastText = 'rgba(0, 0, 0, 0.87)'

        }

        info   = @{

            light        = '#64b5f6'

            main         = '#2196f3'

            dark         = '#1976d2'

            contrastText = '#fff'

        }

        success = @{

            light        = '#81c784'

            main         = '#4caf50'

            dark         = '#388e3c'

            contrastText = 'rgba(0, 0, 0, 0.87)'

        }

        grey   = @{

            50 = '#fafafa'

            100 = '#f5f5f5'

            200 = '#eeeeee'

            300 = '#e0e0e0'

            400 = '#bdbdbd'

            500 = '#9e9e9e'

            600 = '#757575'

            700 = '#616161'

            800 = '#424242'

            900 = '#212121'

            A100 = '#d5d5d5'

            A200 = '#aaaaaa'

            A400 = '#303030'

            A700 = '#616161'

            contrastThreshold = '3'

            getContrastText = 'f E()'

            augmentColor = 'f B()'

            tonalOffset = '0.2'

        }

        text   = @{

            primary   = '#fff'

            secondary = 'rgba(255, 255, 255, 0.7)'

            disabled  = 'rgba(255, 255, 255, 0.5)'

            hint      = 'rgba(255, 255, 255, 0.5)'

            icon      = 'rgba(255, 255, 255, 0.5)'

            divider   = 'rgba(255, 255, 255, 0.12)'

        }

        background = @{

            default = '#303030'

            paper   = '#424242'

        }

        action = @{

            active             = '#fff'

            hover              = 'rgba(255, 255, 255, 0.08)'

            hoverOpacity       = '0.08'

            selected           = 'rgba(255, 255, 255, 0.16)'

            selectedOpacity    = '0.16'

            disabled           = 'rgba(255, 255, 255, 0.3)'

            disabledBackground = 'rgba(255, 255, 255, 0.12)'

            disabledOpacity    = '0.38'

            focus              = 'rgba(255, 255, 255, 0.12)'

            focusOpacity       = '0.12'

            activatedOpacity   = '0.24'

            visited            = '#42a5f5'

        }

        typography = @{

            fontSize = 20

        }

    }

}

light  = @{

    palette = @{

        Common = @{

            black = '#000'

            white = '#fff'

        }

        primary = @{

            main         = '#283593' #'#939b38'

            light        = '#5f5fc4' #'#7986cb'

            dark         = '#001064' #'#303f9f'

            contrastText = '#fff'

        }

        secondary = @{

            light        = '#ff4081'

            main         = '#f50057'

            dark         = '#c51162'

            contrastText = '#fff'

        }

        error  = @{

            light        = '#e57373'

            main         = '#f44336'

            dark         = '#d32f2f'

            contrastText = '#fff'

        }

        warning = @{

            light        = '#ffb74d'

            main         = '#ff9800'

            dark         = '#f57c00'

            contrastText = 'rgba(0, 0, 0, 0.87)'

        }

        info   = @{

            light        = '#64b5f6'

            main         = '#2196f3'

            dark         = '#1976d2'

            contrastText = '#fff'

        }

        success = @{

            light        = '#81c784'

            main         = '#4caf50'

            dark         = '#388e3c'

            contrastText = 'rgba(0, 0, 0, 0.87)'

        }

        grey   = @{

            50 = '#fafafa'

            100 = '#f5f5f5'

            200 = '#eeeeee'

            300 = '#e0e0e0'

            400 = '#bdbdbd'

            500 = '#9e9e9e'

            600 = '#757575'

            700 = '#616161'

            800 = '#424242'

            900 = '#212121'

            A100 = '#d5d5d5'

            A200 = '#aaaaaa'

            A400 = '#303030'

            A700 = '#616161'

            contrastThreshold = '3'

            getContrastText = 'f E()'

            augmentColor = 'f B()'

            tonalOffset = '0.2'

        }

        text   = @{

            primary   = 'rgba(0, 0, 0, 0.87)'

            secondary = 'rgba(0, 0, 0, 0.54)'

            disabled  = 'rgba(0, 0, 0, 0.38)'

            hint      = 'rgba(0, 0, 0, 0.38)'

            divider   = 'rgba(0, 0, 0, 0.12)'

        }

        background = @{

            default = '#fafafa'

            paper   = '#fff'

        }

        action = @{

            active             = 'rgba(0, 0, 0, 0.54)'

            hover              = 'rgba(0, 0, 0, 0.04)'

            hoverOpacity       = '0.04'

            selected           = 'rgba(0, 0, 0, 0.08)'

            selectedOpacity    = '0.8'

            disabled           = 'rgba(0, 0, 0, 0.26)'

            disabledBackground = 'rgba(0, 0, 0, 0.12)'

            disabledOpacity    = '0.38'

            focus              = 'rgba(0, 0, 0, 0.12)'

            focusOpacity       = '0.12'

            activatedOpacity   = '0.12'

        }

        typography = @{

            fontSize = 20

        }

    }

   

}

}

As soon as I remove the theme from the dashboard, it starts working again. What may have changed here?

2

I had this actually and it was related to something within the dashboards.ps1 file but I honestly can’t remember what it was… I want to say it was related to a parameter.

If you look at your dashboards.ps1, does anything stand out or look different?

3

Yeah, I’m not seeing anything different. The only change I make in the dashboard file is I comment out the theme:
New-UDDashboard -Title “Home” -Pages $Pages #-Theme $Theme

As soon as I uncomment the -Theme, it errors out. I’ll also note that if I change my framework back to 3.6, that the problem goes away.

4

So I’m referring to the dashboards.ps1 file that is in the .universal directory.
In my case (IIS Hosted) that’s within the UniversalAutomation folder inside ProgramData.
Have you checked that?

5

in the framework v3 folder of latest 2.4 version locate UniversalDashboard.MaterialUI.psm1 and open it in powershell.
search for new-uddashboard function and change the following line

theme = $Theme | ConvertTo-Json -Depth 10

To

theme = $Theme

save and try.

6

I’ve opened an issue for this. This was done to support MUI overrides but I don’t know why it’s causing this issue. I’ll look into it.

7

The problem has to do with the numbers as keys in the hashtable. You need to convert them to strings.

            grey       = @{
                '50'              = '#fafafa'
                '100'             = '#f5f5f5'
                '200'             = '#eeeeee'
                '300'             = '#e0e0e0'
                '400'             = '#bdbdbd'
                '500'             = '#9e9e9e'
                '600'             = '#757575'
                '700'             = '#616161'
                '800'             = '#424242'
                '900'             = '#212121'
                A100              = '#d5d5d5'
                A200              = '#aaaaaa'
                A400              = '#303030'
                A700              = '#616161'
                contrastThreshold = '3'
                getContrastText   = 'f E()'
                augmentColor      = 'f B()'
                tonalOffset       = '0.2'
            }

This appears to be a problem with ConvertTo-JSON. Previously, everything was being serialized with NewtonSoft so that when we changed this section to convert to JSON, it broke the theme when numbers are used as keys.

I’m going to try to look at what it will take to fix this. If it’s too much I might just provide new guidance on the docs since the work around isn’t too bad.

8

Thanks so much! That is an easy enough of a fix to do on my themes.

1 Like