Using `Publish and create new` doesn't create a new ID about netlify-cms-widgets HOT 9 CLOSED

Ah good to know! 👍 I can send a PR tomorrow if @d4rekanguok haven't fixed it already.

from netlify-cms-widgets.

Thank you for reporting in, I'll try to reproduce the error & see if I can fix it.

from netlify-cms-widgets.

It can be reproduced here:

https://custom-widgets.netlify.com/#/collections/posts/new

The componentDidMount method does not trigger on history changes, one solution could be to replace it with:

public componentWillReceiveProps(nextProps: WidgetProps) {
    const { value, field, onChange } = nextProps
    if (value) return
    // else generate id as previous in didMount...
}

I'm not really familar with lifecycle methods but I've tested it and it seems fine and fixes the bug. Or do you think there are some better solution?

from netlify-cms-widgets.

Yeah, you are not leaving the page, so didMount will not run again. componentWillReceiveProps is deprecated (https://reactjs.org/docs/react-component.html#updating)

The component would be better off using constructor and https://reactjs.org/docs/react-component.html#componentdidupdate to see if the value turned empty to create a new ID

from netlify-cms-widgets.

@gurkodil please do!

from netlify-cms-widgets.

The widget worked as expected now, thanks again @gurkodil @laurenskling! Published in @ncwidgets/[email protected]

from netlify-cms-widgets.

I'm still seeing componentDidMount after installing 0.5.1 🤔

from netlify-cms-widgets.

@laurenskling ugh, sorry that the issue still persists after the update. Could it be a cache issue on your side? I've checked the built js file here, the changes have been applied:

// https://unpkg.com/@ncwidgets/[email protected]/dist/control.js

class Control extends React.Component {
    constructor(props) {
        super(props);
        if (props.value)
            return;
        this.generateId();
    }
    generateId() {
        const { field, onChange } = this.props;
        const usePrefix = field.get('prefix');
        const useTimestamp = field.get('timestamp');
        const prefix = usePrefix ? usePrefix + '-' : '';
        const timestamp = useTimestamp ? Date.now() + '-' : '';
        const id = prefix + timestamp + shortid_1.default();
        onChange(id);
    }
    componentDidUpdate() {
        if (this.props.value)
            return;
        this.generateId();
    }
    render() {
        const { forID, classNameWrapper, setActiveStyle, setInactiveStyle, value, } = this.props;
        return (React.createElement("input", { type: 'text', className: classNameWrapper, style: {
                color: '#cdcdcd',
            }, value: value || '', id: forID, onFocus: setActiveStyle, onBlur: setInactiveStyle, disabled: true }));
    }
}
exports.Control = Control;

I've also tried the component in a codesandbox, and the component does generate a new id when using 'Publish and create new' option : https://codesandbox.io/s/netlify-cms-app-example-h5n43?fontsize=14&hidenavigation=1&theme=dark

from netlify-cms-widgets.

Just installed it correctly! Must have been some caching issue https://shouldiblamecaching.com/

Thanks so much!

from netlify-cms-widgets.