twenty/packages
gitstart-app[bot] 8afa504b65
Add Skeleton loading for side panel (#7394)
This PR was created by [GitStart](https://gitstart.com/) to address the
requirements from this ticket:
[TWNTY-7112](https://clients.gitstart.com/twenty/5449/tickets/TWNTY-7112).

 --- 


### Description

- To test you can use `await new Promise(r => setTimeout(r, 5000));`
line 74 of \`openCreateActivityDrawer.ts\`
- We added a recoil state to define the loading status
- Design points to note:

1 - We did not change the chip component styles because would be
unrelated to the issue can you confirm if you still need this change?


![](https://assets-service.gitstart.com/28455/c5999ef1-a7fc-4c53-b425-d0588092ba90.png)

2- In Figma, the loading state shows the Chip rendering an initial name
before showing the loaded name, currently, we are rendering the correct
name while loading, the change that makes this possible is below


![](https://assets-service.gitstart.com/28455/a0e14045-9a14-4d19-9570-62781fba1aa4.png)

if we set it as null, the initial name would appear, but also the
previous data in the state would affect the UI, passing the
`activityObjectNameSingular` data allows us to clear the previous data,
and make the Chip instantly updated, let us know if this behavior is
fine, or if you still want an initial name to be rendered while is
loading.

3 - Currently, the loading state of the tabs does not affect the
selected tab (auto-defined by the component) should we change this logic
for all Tabs used in the app, or make this behavior optional by using
props?


![](https://assets-service.gitstart.com/28455/223c2e9f-3f4b-4107-b40d-f98a95266d5d.png)

### Demo


<https://www.loom.com/share/590df738a8ec41e6b64232bde237c01f?sid=7f8f4e40-ec82-4282-a43d-452a1cf27f4a>

### Refs

#7112

---------

Co-authored-by: gitstart-twenty <gitstart-twenty@users.noreply.github.com>
Co-authored-by: gitstart-twenty <140154534+gitstart-twenty@users.noreply.github.com>
Co-authored-by: Marie Stoppa <marie.stoppa@essec.edu>
2024-10-04 11:41:05 +02:00
..
twenty-chrome-extension Support for multiple values in the Phone field (#6882) 2024-09-11 11:15:04 +02:00
twenty-docker Add 0.30 release notes (#7300) 2024-09-27 19:10:26 +02:00
twenty-e2e-testing E2E tests (#6717) 2024-08-27 11:07:10 +02:00
twenty-emails Tag main as 0.31 canary (#7332) 2024-09-30 11:42:06 +02:00
twenty-front Add Skeleton loading for side panel (#7394) 2024-10-04 11:41:05 +02:00
twenty-postgres Check if user wants to run make postgres-on-linux (#6819) 2024-09-04 16:58:54 +02:00
twenty-server Allow input and display of floats for Number fields (#7340) 2024-10-04 10:45:25 +02:00
twenty-ui TWNTY-6808 - Ability to Filter by Creation Source (#7078) 2024-10-02 17:56:09 +02:00
twenty-utils Fix docs build in CI (#5826) 2024-06-11 19:06:37 +02:00
twenty-website Github banner (#7371) 2024-10-01 15:29:35 +02:00
twenty-zapier [Fix] Remove usage of deprecated FieldMetadata type probability (#6279) 2024-07-16 11:36:10 +02:00