Recipes drag and drop feature #314
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
st0nebreaker
suggested changes
Jul 20, 2023
There was a problem hiding this comment.
This is great, thank you!!
- For persisting the indices, I believe you can use the
LocalStorageProvider.ts(Memento docs) - Is it possible to add some CSS to the dragging item? It'd be great if it had a top white border like the VS Code extension icons do to help the eye track where the items moving too (especially since the tags are full of text).
Screen.Recording.2023-07-20.at.3.56.47.PM.mov
|
@st0nebraker Thanks for the review. I will make the CSS changes you suggested. |
|
@st0nebraker I have made all the requested changes for the pre-defined recipes, and also added the state to save the order of it. I think it's all good for review now. REC-20230723210224.mp4 |
|
@st0nebraker Can I have a review, please? |
st0nebreaker
approved these changes
Jul 26, 2023
vscode/webviews/Recipes.module.css
Outdated
Comment on lines
15
to
16
| border-top: 2px solid var(--vscode-activityBar-activeBorder | ||
| ); |
There was a problem hiding this comment.
Suggested change
| border-top: 2px solid var(--vscode-activityBar-activeBorder | |
| ); | |
| border-top: 2px solid var(--vscode-activityBar-activeBorder); |
vscode/webviews/Recipes.tsx
Outdated
Comment on lines
145
to
147
| className={`${styles.recipeButton} ${ | ||
| draggedIndex === index ? styles.recipeButtonDrag : '' | ||
| }`} |
There was a problem hiding this comment.
Suggested change
| className={`${styles.recipeButton} ${ | |
| draggedIndex === index ? styles.recipeButtonDrag : '' | |
| }`} | |
| className={classNames( | |
| styles.recipeButton, | |
| draggedIndex === index && styles.recipeButtonDrag | |
| )} |
| @@ -1,3 +1,5 @@ | |||
| import { useState } from 'react' | |||
|
|
|||
| import { VSCodeButton } from '@vscode/webview-ui-toolkit/react' | |||
There was a problem hiding this comment.
Suggested change
| import { VSCodeButton } from '@vscode/webview-ui-toolkit/react' | |
| import { VSCodeButton } from '@vscode/webview-ui-toolkit/react' | |
| import classNames from 'classnames' |
vscode/webviews/Recipes.tsx
Outdated
Comment on lines
36
to
37
| const initalState = vscodeAPI.getState() as State | undefined | ||
| const reorderedRecipeList: RecipeListType = initalState?.reorderedRecipes ?? recipesList |
There was a problem hiding this comment.
Suggested change
| const initalState = vscodeAPI.getState() as State | undefined | |
| const reorderedRecipeList: RecipeListType = initalState?.reorderedRecipes ?? recipesList | |
| const initialState = vscodeAPI.getState() as State | undefined | |
| const reorderedRecipeList: RecipeListType = initialState?.reorderedRecipes ?? recipesList |
|
@st0nebraker Made all the changes. It's all good to merge now. |
|
@st0nebraker Can you merge this PR, please? |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
This PR closes #230.
Test plan
Tested it manually.
Run the extension, head over to the recipes section and try to drag and reorder the recipes.
REC-20230719184916.mp4