Issue with `defaultProps` placement in Remotion causing error when saving default props.

[JonnyBurger]

From message posted on Discord by d3ch0

Does anyone know if this is a bug. Definiting defaultProps BEFORE id seems to give this error in the Studio:

Can't save default props: No `defaultProps` prop found in the <Composition/> tag with the ID "HelloWorld"..

// Root.tsx > RemotionRoot component
<>
  // ✅ this works
  <Composition
    id="HelloWorld"
    defaultProps={{ titleText: "Welcome to Remotion" }}
  />
  // ❌ not working because defaultProps are BEFORE id
  <Composition
    defaultProps={{ titleText: "Welcome to Remotion" }}
    id="HelloWorld"
  />
</>

I'm just starting with Remotion so maybe im missing something.

[kyesildagli]

Can not reproduce.

[virtuallyunknown]

Was having this issue with 4.0.153, now I updated to 4.0.171 and it's still there. If you have something like this, it will give you that error.

import { Composition } from 'remotion';
import { z } from 'zod';
import { Comp } from './HelloWorld';
import './style.css';

const durationInSeconds = 5;
const fps = 60;

export const RemotionRoot: React.FC = () => {
    return (
        <>
            <Composition
                component={Comp}
                schema={z.object({
                    backgroundColor: z.string(),
                })}
                durationInFrames={durationInSeconds * fps}
                fps={fps}
                height={720}
                defaultProps={{ backgroundColor: 'blue' }}
                width={1280}
                id='hello-world'
            />
        </>
    );
};

Anyway though, this isn't a big deal at all (for me), I just add this line in my file Root.tsx and it's not a problem:

/* eslint-disable @stylistic/jsx-sort-props */

Otherwise eslint will sort the props.

[hunxjunedo]

@JonnyBurger looks like this might have been resolved as now we are using an ast-based codemod.

[JonnyBurger]

Indeed :) Thanks @hunxjunedo