Internal: Variables - permissions (client-side) [ED-19876]#31806
Internal: Variables - permissions (client-side) [ED-19876]#31806mike-elementor merged 15 commits intoelementor:mainfrom
Conversation
| export const usePermissions = () => { | ||
| const { canUser: userCan } = useCurrentUserCapabilities(); | ||
|
|
||
| const [ permissions ] = useState( () => { |
| import { useCurrentUserCapabilities } from '@elementor/editor-current-user'; | ||
|
|
||
| export const usePermissions = () => { | ||
| const { canUser: userCan } = useCurrentUserCapabilities(); |
There was a problem hiding this comment.
It's super confusing. Can we align with what we're getting from useCurrentUserCapabilities()?
| ); | ||
| }; | ||
|
|
||
| function CreateYourVariable( { title, onAdd }: Omit< Props, 'icon' > ) { |
There was a problem hiding this comment.
Maybe?
| function CreateYourVariable( { title, onAdd }: Omit< Props, 'icon' > ) { | |
| function VariablesEmptyState( { title, onAdd }: Omit< Props, 'icon' > ) { |
| > | ||
| { icon } | ||
|
|
||
| { userPermissions.canAdd() ? ( |
There was a problem hiding this comment.
We might be able to create a common structure for these components:
canAdd = userPermissions.canAdd();
<VariablesEmptyState title={ canAdd ? title : __( 'There are no variables', 'elementor' ) } captions={ canAdd ? __( 'Variables are saved attributes that you can apply anywhere on your site.', 'elementor' ) : __( 'With your current role, you can only connect and detach variables.', 'elementor' ) } onAdd={ canAdd ? onAdd : undefined } />
function VariablesEmptyState( { title, captions, onAdd }: Omit< Props, 'icon' > ) {This will convert it to a single common component (that can also be extracted to a different component)
WDYT?
| } | ||
| const handleRestore = userPermissions.canRestore() | ||
| ? () => { | ||
| if ( ! variable.key ) { |
There was a problem hiding this comment.
This check can move to line 44 as well (or vice-versa, move the permission check here 😄 )
| }; | ||
|
|
||
| const handlers: Handlers = { | ||
| onAdd: undefined, |
There was a problem hiding this comment.
Let's continue with the inline assigning as we did before (onAdd: userPermissions.canAdd() ? () => { props.setCurrentView( VIEW_ADD ) } : undefined)
|
|
||
| const handlers: Handlers = { | ||
| onAdd: undefined, | ||
| onEdit: undefined, |
There was a problem hiding this comment.
Same as above (inline assigning)
PR Checklist
PR Type
What kind of change does this PR introduce?
Summary
This PR can be summarized in the following changelog entry:
Description
An explanation of what is done in this PR
Test instructions
This PR can be tested by following these steps:
Quality assurance
Fixes #
✨ PR Description
Purpose: Add permissions-based access control to Variables feature with user capabilities validation on the client-side.
Main changes:
Generated by LinearB AI and added by gitStream.
AI-generated content may contain inaccuracies. Please verify before using. We'd love your feedback! 🚀