UXP panel not working

Photoshop UXP Plugin API
1

Greetings everyone, it’s been a while since I’ve been here. I am currently having trouble my plugin. Specifically one panel of it. I am using older version of ps. Specifically 2023. I have no issues. One of my friends on ps 2025. I am having trouble replicating it myself in ps 2025. The worst part is that even all the loggers that I made for the plugin dont’ tell me anything. The panel probably fails during the loading, however i have no idea why at all…

Here is the panel in question:

import React from ‘react’;
import “../../CommonStyles.css”;
import {useDispatch} from “react-redux”;
import {syncLogDecorator} from “../../utils/Logger”;
import {addLeadingZeros} from “../../utils/helper”;
import {useSetUp} from “../../utils/presetManager”;
import {setNamingPattern} from “../../redux/namingSlice”;
import {NamingSection} from “./sections/NamingSection”;
import {SavedPatternsSection} from “./sections/SavedPatternsSection”;

export const NamingPanel = () => {
useSetUp()
const exampleFilename = “FileName001”
const exampleFileNumber = 1


const dispatch = useDispatch()

const applyTemplate = syncLogDecorator(function applyTemplate(inputName)  {
    if (inputName.length < 1) {
        alert("Template is empty")
        return
    }
    const originalNameAppend = inputName.replaceAll("%og%", exampleFilename)
    const fileNumberAppend = originalNameAppend.replaceAll("%num%", String(exampleFileNumber))
    const leadingZerosPattern = /%a\d+%/
    let leadingZerosAppend = fileNumberAppend
    while (leadingZerosPattern.test(leadingZerosAppend)) {
        const match = leadingZerosPattern.exec(leadingZerosAppend)['0']
        const padLength = parseInt(match.substring(2, match.length - 1))
        const paddedNum = addLeadingZeros(exampleFileNumber, padLength)
        leadingZerosAppend = leadingZerosAppend.replaceAll(match, paddedNum)
    }
    return leadingZerosAppend
})

const setTemplate = syncLogDecorator(function setTemplate(template) {
    console.log('Setting naming pattern: ', template)
    dispatch(setNamingPattern(template))
})

return <div id={"naming"}>
    <NamingSection exampleFilename={exampleFilename} applyTemplate={applyTemplate} setTemplate={setTemplate}/>
    <SavedPatternsSection setTemplate={setTemplate} applyTemplate={applyTemplate}/>
</div>
}

I think this code is the culprit, however I still can’t replicate it so it’s hard to say…

import {createDataFolderStruct, readFile, spawnActionListener} from "./helper";
import {useDispatch} from "react-redux";
import {storage} from 'uxp';
import {PATH_DELIMITER, SETTINGS_FOLDER, SETTINGS_FILE, STORAGE_FOLDER, PROJECT_FILE, PRESET_FILE} from "./constants";
import {setAllStates} from "../redux/settingsSlice";
import {clearLogs, logDecorator} from "./Logger";
import {setSavedNamingPatterns, setSavedProjects} from "../redux/presetSlice";

const fs = storage.localFileSystem;
// tells the program whether the initial loading of all preset files was called
let wasSetUp = false

export const useSetUp = () => {
    // Custom hook for initial setup when loading
    const dispatch = useDispatch() // for some fucking reason, i need to define this here otherwise I am breaking rules of hooks or whatever bla bla
    if (!wasSetUp) {
        wasSetUp = true
        console.log("Doing set up")
        // creates the necessary folders and files if they weren't created yet
        createDataFolderStruct().then(() => {
            loadSettings().then((settings)=> {
                dispatch(setAllStates(settings))
                console.log("Loaded saved settings: ", settings)
            })
            loadSavedProjects().then((projects) => {
                dispatch(setSavedProjects(projects))
                console.log("Loaded saved projects: ", projects)
            })
            loadPresets().then((presets) => {
                dispatch(setSavedNamingPatterns(presets))
                console.log("Loaded saved presets: ", presets)
            })
            clearLogs().then(() => console.log("Cleared logs"))
        })

        spawnActionListener().then()
    } else {
        // console.log("Setup was already called!")
    }
}

const loadSettings = logDecorator(async function loadSettings() {
    const settingsFile = `${SETTINGS_FOLDER}${PATH_DELIMITER}${SETTINGS_FILE}`
    const dataFolder = await fs.getDataFolder()
    const dataFolderPath = dataFolder.nativePath
    const content = await readFile(`${dataFolderPath}${PATH_DELIMITER}${settingsFile}`)
    return JSON.parse(content)
})

const loadSavedProjects = logDecorator(async function loadSavedProjects() {
    const projectFile = `${STORAGE_FOLDER}${PATH_DELIMITER}${PROJECT_FILE}`
    const dataFolder = await fs.getDataFolder()
    const dataFolderPath = dataFolder.nativePath
    const fileContents = await readFile(`${dataFolderPath}${PATH_DELIMITER}${projectFile}`)
    return JSON.parse(fileContents)
})
const loadPresets = logDecorator(async function loadPresets() {
    const presetFile = `${STORAGE_FOLDER}${PATH_DELIMITER}${PRESET_FILE}`
    const dataFolder = await fs.getDataFolder()
    const dataFolderPath = dataFolder.nativePath
    const presetContents = await readFile(`${dataFolderPath}${PATH_DELIMITER}${presetFile}`)
    return JSON.parse(presetContents)
})

Any ideas?