Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Feat: API Playground #10376

Open
wants to merge 74 commits into
base: main
Choose a base branch
from
Open

Feat: API Playground #10376

wants to merge 74 commits into from

Conversation

oliverqx
Copy link

/claim #10283

@oliverqx
feat: update translations
2fdcc8c
@oliverqx
feat: export webhook icon
e0c50d9
@oliverqx
feat: update navigation bar
b44c62c
@oliverqx
feat: create api keys page and story for it
13b9832
@oliverqx
fix: update title/path for story
4db13d2
@oliverqx
fix: update stories names
908fc30
@oliverqx
feat: create playground cover image component
f512f60
@oliverqx
feat: implement cover image component
78cf4de
@oliverqx
feat: add playground setup form
0eb0385
@oliverqx
feat: export icons
27fba5c
@oliverqx
feat: update fields
7463d09
@oliverqx
fix: align all form items end
be35f3e
@oliverqx
feat: expose developersApiKey endpoint
3b204ab
@oliverqx
feat: use available api keys for select
8a31fae
@oliverqx
fix: use grid for more consistent spacing
d31e3f3
@oliverqx
chore: remove SettingsDevelopers route and components
faf1290
@oliverqx
fix: add apis to settings path
7fe5809
@oliverqx
chore: update apiKey components navigation
66bce6c
@oliverqx
chore: remove remaining traces of developers route
89c41c6
@oliverqx
feat: create settings webhooks component
705dd65
@oliverqx
feat: fix options when no apiKeys are available
7eb7dfb
@algora-pbc algora-pbc bot mentioned this pull request Feb 21, 2025
Open
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Feb 21, 2025 •
edited
Loading

Welcome!

Hello there, congrats on your first PR! We're excited to have you contributing to this project.
By submitting your Pull Request, you acknowledge that you agree with the terms of our Contributor License Agreement.

Generated by 🚫 dangerJS against 08766d6

@oliverqx
feat: add theme to rest api playground
b721a1c
@oliverqx
feat: update file names
15e62bb 
- RestApiWrapper -> RestPlayground
- GraphQLWrapper -> GraphQLPlayground
- APIPlayground -> PlaygroundRouter
@oliverqx
fix: add @codemirror/state to package resolutions
52fd472
@oliverqx
fix: update path
b3cf247
@oliverqx
feat: change file names
fa9c364 
- SettingsApiPlaygroundCoverImage -> SettingsPlaygroundCoverImage
- ApiPlaygroundSetupForm -> PlaygroundSetupForm
@oliverqx
feat: add theme to GraphQLPlayground
21a35b1
@oliverqx
fix: remove SubMenuTopBarContainer and add PageHeader instead
00a4f2a
@oliverqx
feat: add close rest playground button
d33e937
@oliverqx
feat: create PlaygroundPage
117e173 
- stop using SubMenuTopBarContainer and create PlaygroundPage to fix padding and border radius issues
@oliverqx
lint
b1d4da8
@oliverqx
fix: improve spacing
a37f80c
@oliverqx
lint
2dfc865
@oliverqx
fix: wrap select options in a useMemo
f38a67b
@oliverqx
Copy link
Author

oliverqx commented Feb 23, 2025 •
edited
Loading

in terms of storybook testing, I've built interaction unit testing - almost like integration UI testing, but I feel like playgrounds themselves (graphiql, scalar) would be out of scope. Please let me know if I should test them

@FelixMalfait
Copy link
Member

Great @oliverqx thanks a lot!!! I'll do a full review tonight

@FelixMalfait FelixMalfait mentioned this pull request Feb 23, 2025
Closed
@FelixMalfait
Copy link
Member

Yes the code in twenty-website was ugly, we don't apply the same level of standard to twenty-website (marketing website) as we do in twenty-front.

I'm sorry I should have told you upfront but one thing I had mentioned over Discord to the other PR was that I don't think the "dropdown to select your API key" works. Because we're not able to access an API Key after it's been generated. So the best we can do is ask the person to paste the key in an input field (but a random api key as placeholder). Eventually if they generated a key in the same session we can prefill it with the apiKeyTokenFamilyState(bonus, not required!) which we use to persist it during a session. But if you refresh the page it's lost.

Would you mind also checkin the CI?

Thanks again for this great work!

@FelixMalfait
Copy link
Member

I awarded the bounty given the considerable amount of work you did. But would appreciate if you get this to the end of course! Feel free to ping me on Discord if you want to discuss other tasks in the future (username: ifelx)

@FelixMalfait FelixMalfait mentioned this pull request Feb 23, 2025
Open
@oliverqx
fix: update icon exports
4f7eb77
@oliverqx
fix: update light cover
4cc9aa6 
remove border
@oliverqx
feat: add playgroundPageContainer ScrollWrapperContext
3a83457
@oliverqx
fix: comply with figma paddings
fef78f0 
- add padding bottom
- add background color
@oliverqx
fix: REST Playground padding
371b7a8 
- add scroll wrapper
- add nested container. used to apply max height to vue app. otherwise, the bottom padding is not seen
@oliverqx
fix: update css selectors
08766d6
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@FelixMalfait FelixMalfait FelixMalfait left review comments

@greptile-apps greptile-apps[bot] greptile-apps[bot] left review comments

At least 1 approving review is required to merge this pull request.

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@oliverqx @FelixMalfait