Pass prop to photoshop function

Photoshop UXP Plugin API
,
1

I am trying to pass the props to ‘createLater’ function but I am getting error → 

Type '{ layerName: any; }' is not assignable to type 'string'.ts(2322)
index.d.ts(1020, 5): The expected type comes from property 'name' which is declared here on type 'Partial<Layer>'
(property) name?: string

Solution is probably trivial but I can’t figure it out.

TestComponent.tsx

export default function TestComponent({ layerName }) { 
  const handleClick = async () => {
    try {
      await core.executeAsModal(
        async () => {
          await app.activeDocument.createLayer({ name: { layerName } }); //NOT WORKING HERE
        },
        { commandName: 'Adding new layer with a name I had choosed' }
      );
    } catch (error) {
      console.log(error);
    }
  };

  return (
    <Spectrum.Button variant="secondary" onClick={handleClick}>
      Make layer {layerName} //WORKING HERE
    </Spectrum.Button>
  );
}



TestComponent.propTypes = {
  layerName: PropTypes.string,
};
2

This is a TypeScript error. Your layerName that TestComponent accepts does not have a type defined. I don’t see you using TS yourself, so maybe worth removing it over all? Or maybe:

export default function TestComponent({ layerName }: { layerName: string }) {

But I assume, if you already asked the question, you’re not really familiar with TypeScript, so I’d go with the first option by removing TS support.

P. S. Are you using React Spectrum? Does it even work in UXP? :face_with_monocle:

3

Okay, now Type '{ layerName: string; }' is not assignable to type 'string'.
When I do that createLayer({ name: layerName }) i can use only initial layerName value
.

and yes, I am not really familliar with TS, also react is new to me. I try to stick with TS, for practice.

Regarding Spectrum I’m not using unsupported @adobe/react-spectrum but @thejustinwalsh’s React-uxp-spectrum

4

Could you paste exact string from your code where you define TestComponent? And the part where you include that component - like <TestComponent layerName={someName} />. What would be someName there?

5

It turns out that it’s not any related to photoshop
I made codesandbox with similar code but simplified.

6

Your error is from TypeScript, but your shared code is pure JS and doesn’t have any errors

1 Like
7

I changed Spectrum.Button to default sp-button and everything is working
Don’t know why tho