fix(ui): trim leading and trailing whitespace in group names

[mxyng]

Summary

leading whitespaces are particularly problematic because it makes it possible to create group names that look empty, e.g. " ". a side effect is group names with " " (one whitespace) and " " (multple consecutive whitespaces) will cause a 409 Conflict on creation since the server trims inputs.

non-leading or non-trailing whitespaces are left as is so it's possible to have repeats in t between other characters

[BruceMacD]

nit:

Rather than trimming the name here and in the error you could do one setName(name.trim()) before the try/catch block.

[mxyng]

That was the initial approach I took but it has two major downsides.

The first is it doesn't provide immediate feedback to the user when entering leading whitespace so what they think they've inputted into the field is not what's actually being sent to the server. This is minor.

The second is useState doesn't immediately update the state. React batches state updates so if the state is changed immediately before it's checked, the update may not yet have been updated. This is problematic since the state is being updated immediately before sent to the server so while the state may be trimmed, the value being sent is untrimmed (most likely).