Batch renaming speakers not working

[pietrop]

Describe the bug

Batch renaming speakers not working

To Reproduce Steps to reproduce the behavior:

1. Go to storybook, locally or here
2. Click on a speaker
3. change the name
4. click OK
5. click OK
6. See error (desired speaker labels changes are not applied)

Expected behavior

When you click OK

and then click OK

for the changes to take effect and persists

Screenshots

Example of how it's currently not working

Additional context

NA

[pietrop]

Figured it out! 🥳

In handleSetSpeakerName slate-transcript-editor/src/components/index.js#L204

- match: node => node.type === 'timedText' && node.speaker === oldSpeakerName,
+ match: node => node.type === 'timedText' && node.speaker.toLowerCase() === oldSpeakerName.toLowerCase(),

I think at some point the speaker was changed to all caps.

I think a better solution would be to also change slate-transcript-editor/src/components/index.js#L248-L262 to use CSS to transform the display of the speaker names rather then modifying the actual value with js.

<Col contentEditable={false} xs={8} sm={10} md={8} lg={3} xl={3} className={'p-t-2 text-truncate'}>
         <span
              contentEditable={false}
              className={'text-truncate text-muted unselectable'}
              style={{
                cursor: 'pointer',
                width: '100%',
+               textTransform: 'uppercase',
              }}
-              title={props.element.speaker.toUpperCase()}
+              title={props.element.speaker}
              onClick={handleSetSpeakerName.bind(this, props.element)}
            >
              {' '}
-               {props.element.speaker.toUpperCase()}
+               {props.element.speaker}
     </span>
</Col>

also inhandleSetSpeakerName in slate-transcript-editor/src/components/index.js#L192

+ const oldSpeakerName = element.speaker;
- const oldSpeakerName = element.speaker.toUpperCase();