-
Notifications
You must be signed in to change notification settings - Fork 6
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.
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
Remove makeStyles
from AlkemioAvatar
and CommunityUpdatesView
#7390
Conversation
The goal is to remove `@mui/styles`, but as the component is deprecated, it is replaced with the new avatar component in the user popup and the deprecated component is cleaned up from all unused features. The user popup is inlined in it to simplify more the interface of the component.
WalkthroughThis pull request introduces significant changes across multiple components, primarily focusing on the complete removal of the Changes
Possibly related PRs
Suggested labels
Suggested reviewers
Finishing Touches
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (3)
src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (1)
28-28
: Consider using a stable identifier for the key prop.Using the array index (
i
) as the key might lead to unintentional re-renders or mismatches if the list changes order. A stable identifier likeu.id
is more robust.- <AlkemioAvatar key={i} src={u.profile.visual?.uri} name={u.profile.displayName} userId={u.id} /> + <AlkemioAvatar key={u.id} src={u.profile.visual?.uri} name={u.profile.displayName} userId={u.id} />src/core/ui/image/AlkemioAvatar.tsx (1)
17-20
: Validate whether you need a forwardRef here.Since this component doesn't seem to forward DOM references to child elements externally, confirm if
forwardRef
is strictly necessary.src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx (1)
68-74
: Keep an eye on theme dependency.Using inline arrow functions with the
theme
parameter forsx
or style objects is fine, but watch out for performance overhead if many elements re-render. Consider memoizing style objects for frequently rendered components.
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
src/core/ui/image/AlkemioAvatar.tsx
(1 hunks)src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx
(8 hunks)src/domain/community/user/userPopUp/UserPopUp.tsx
(2 hunks)src/domain/platform/admin/components/Group/GroupMembersDetails.tsx
(2 hunks)
🧰 Additional context used
📓 Path-based instructions (4)
src/domain/community/user/userPopUp/UserPopUp.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
src/core/ui/image/AlkemioAvatar.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
🔇 Additional comments (10)
src/core/ui/image/AlkemioAvatar.tsx (3)
7-10
: Good enhancement: Requiring the userId prop.By making
userId
a required field, you ensure that the popup logic can reliably fetch user details. This reduces potential undefined behavior downstream.
28-36
: Tooltip logic is a neat approach.Wrapping the image in a tooltip only when
name
is present keeps the UI minimal. Consider continuing to handle edge cases, such as overly long names, with graceful truncation or formatting if needed.
38-75
: Mind the user-driven popups.By opening the
UserPopUp
on click, ensure no repeated or overlapping popups appear if multiple avatars are clicked at once. Also, confirm that the global click handlers don't conflict when multiple avatars are present on the same page.src/domain/community/user/userPopUp/UserPopUp.tsx (1)
129-134
: Good accessibility enhancement.Using
aria-label
with the user's display name improves screen reader support and overall accessibility. Continue ensuring user-generated text is sanitized before rendering to prevent XSS or other injection attacks.src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx (6)
Line range hint
1-31
: Style updates and import reorganization look consistent.Removing
makeStyles
in favor of MUI'ssx
prop helps centralize styling. This approach aligns with Material-UI’s recommended pattern.
175-179
: Skeleton placeholder usage is clear.The placeholder UI for loading states is user-friendly. Continue with consistent usage across the app to maintain a coherent loading flow.
209-209
: Consistent usage of AlkemioAvatar is appreciated.Including
userId
matches the revised AlkemioAvatar API. Ensure that any fallback logic handles cases wheremember
ormember.id
may be missing to avoid runtime errors.
234-234
: Positioning style withsx
is well applied.Defining
position: 'relative'
through thesx
prop is straightforward and makes the usage more discoverable and consistent.
244-259
: Nice gradient overlay for collapsed content.Leveraging
alpha
from Material-UI for the fade effect is clean and easily maintainable. This approach helps users see truncated content intuitively.
290-292
: Rotate transition for expand/collapse is implemented cleanly.Toggling
transform
with a short transition provides a smooth UI experience. The conditional object spread in thesx
prop is a neat pattern.
* Pass id for key instead of index in AlkemioAvatar * Remove unused forwardRef Also the GroupMembersDetailsAvatarContainer is deleted as it has a lot of unused functionality and some unused styles are deleted.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (4)
src/core/ui/image/AlkemioAvatar.tsx (3)
17-24
: Consider adding error boundary for image loading failures.While the local state handles image loading failures, consider implementing an error boundary to gracefully handle other potential runtime errors.
28-36
: Enhance tooltip accessibility.Consider adding
aria-label
to improve screen reader support. Also, the tooltip ID 'membersTooltip' might not be unique if multiple avatars are rendered on the same page.- <Tooltip placement={'bottom'} id={'membersTooltip'} title={name}> + <Tooltip placement={'bottom'} id={`avatar-tooltip-${userId}`} title={name} aria-label={name}>
38-74
: Consider extracting common styles to theme.The styling looks good, but consider moving common avatar styles to the theme to maintain consistency across the application, especially since this component is being deprecated in favor of MUI Avatar.
src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (1)
25-40
: Consider performance optimization for large member lists.The implementation looks good, but consider adding virtualization for better performance when rendering large lists of avatars.
import { VirtualizedGrid } from '@mui/x-data-grid'; // Example implementation const VirtualizedAvatars = ({ items }) => ( <VirtualizedGrid items={items} renderItem={(u) => ( <AlkemioAvatar key={u.id} src={u.profile.visual?.uri} name={u.profile.displayName} userId={u.id} /> )} /> );
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
src/core/ui/image/AlkemioAvatar.tsx
(1 hunks)src/domain/community/user/userPopUp/UserPopUp.tsx
(2 hunks)src/domain/platform/admin/components/Group/GroupMembersDetails.tsx
(2 hunks)src/domain/platform/admin/components/Group/GroupMembersDetailsAvatarContainer.tsx
(0 hunks)
💤 Files with no reviewable changes (1)
- src/domain/platform/admin/components/Group/GroupMembersDetailsAvatarContainer.tsx
🚧 Files skipped from review as they are similar to previous changes (1)
- src/domain/community/user/userPopUp/UserPopUp.tsx
🧰 Additional context used
📓 Path-based instructions (2)
src/core/ui/image/AlkemioAvatar.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
🔇 Additional comments (2)
src/core/ui/image/AlkemioAvatar.tsx (1)
1-10
: LGTM! Interface simplification aligns with deprecation plan.The removal of styling-related props and addition of required
userId
prop improves the component's interface.src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (1)
1-5
: LGTM! Import changes align with component updates.The switch to named import reflects the changes in AlkemioAvatar component.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Nice!
In addition, I removed the AlkemioAvatar completely. Let me know if you have any concerns.
Thank you for moving this forward, @thalacheva 🙏
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (4)
src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (2)
52-60
: Enhance accessibility and keyboard navigation.Consider the following improvements:
- Make the Avatar component keyboard accessible by adding
tabIndex={0}
and handling keyboard events- Add
role="button"
since the avatar is clickable- Make the aria-label more descriptive by including the action
<Avatar src={u.profile.visual?.uri} - aria-label="User avatar" + aria-label={`View profile of ${u.profile.displayName}`} + role="button" + tabIndex={0} alt={t('common.avatar-of', { user: u.profile.displayName })} onClick={() => onMemberClick(u.id)} + onKeyDown={(e) => e.key === 'Enter' && onMemberClick(u.id)} sx={{ cursor: 'pointer' }} >
50-61
: Consider performance optimization for large lists.Wrapping each avatar with a Tooltip component can impact performance for large member lists. Consider using a single tooltip instance and managing its state and position manually.
src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx (2)
248-263
: Consider extracting the gradient style to a constantThe gradient style definition could be moved to a constant to improve maintainability and reusability.
+const fadeGradientStyle = theme => ({ + position: 'absolute', + bottom: 0, + width: '100%', + height: '100%', + background: `linear-gradient(to top, ${alpha(theme.palette.background.paper, 1)} 20%, ${alpha( + theme.palette.background.paper, + 0 + )} 80%)`, + pointerEvents: 'none', +}); {!(expanded || disableCollapse) && ( - <Box - sx={{ - position: 'absolute', - bottom: 0, - width: '100%', - height: '100%', - background: theme => - `linear-gradient(to top, ${alpha(theme.palette.background.paper, 1)} 20%, ${alpha( - theme.palette.background.paper, - 0 - )} 80%)`, - pointerEvents: 'none', - }} - /> + <Box sx={fadeGradientStyle} /> )}
206-214
: Enhance avatar accessibility with more descriptive alt textWhile the current implementation is good, the alt text could be more descriptive by including the user's role or context.
-alt={t('common.avatar-of', { user: member.displayName })} +alt={t('common.avatar-of-community-member', { user: member.displayName })}
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (3)
src/core/ui/image/AlkemioAvatar.tsx
(0 hunks)src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx
(8 hunks)src/domain/platform/admin/components/Group/GroupMembersDetails.tsx
(2 hunks)
💤 Files with no reviewable changes (1)
- src/core/ui/image/AlkemioAvatar.tsx
🧰 Additional context used
📓 Path-based instructions (2)
src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (1)
Pattern src/**/*.{ts,tsx,js}
: Review the React.js/TypeScript/JavaScript code for best practices and potential bugs.
Ensure that the code adheres to TypeScript's typing system and modern standards.
Use the following code guide documentation in the codebase: 'docs/code-guidelines.md'.
Ensure sufficient error handling and logging is present, but note:
- We have a global error handler in place. So local
try/catch
blocks are not required unless they provide value beyond what the global error handler already covers. - Avoid flagging the absence of local error handling in cases where the global error handler suffices.
- Avoid flagging the absence of logging in cases where the global logger is already in place (graphql usage).
Inform about the recommendation of not using non-null assertion,
except on GraphQL queries where the variable is asserted non-null and followed by a
skip:
with the same variable.
Examples:
- Not Required: there's a skip
{
variables: { templateId: templateId! },
skip: !templateId,
}
Check for common security vulnerabilities such as:
- SQL Injection
- XSS (Cross-Site Scripting)
- CSRF (Cross-Site Request Forgery)
- Insecure dependencies
- Sensitive data exposure
⏰ Context from checks skipped due to timeout of 90000ms (1)
- GitHub Check: Travis CI - Pull Request
🔇 Additional comments (5)
src/domain/platform/admin/components/Group/GroupMembersDetails.tsx (2)
Line range hint
1-15
: LGTM! Clean imports and well-defined types.The imports are well-organized, and the interface is properly typed with TypeScript.
18-29
: LGTM! Clean state management implementation.The state management and event handlers are well-implemented, following React best practices. Good job resetting the memberId to undefined when closing the popup.
src/domain/community/community/views/CommunityUpdates/CommunityUpdatesView.tsx (3)
Line range hint
1-40
: LGTM! Good modernization of importsThe changes align well with modern React practices by moving away from JSS to MUI's built-in styling system.
Line range hint
77-334
: LGTM! Well-structured component with proper state managementThe component successfully:
- Replaces
AlkemioAvatar
with the standardAvatar
component- Handles loading and error states appropriately
- Uses TypeScript effectively
Line range hint
115-115
: Address the TODO comment about missing translationsThe comment indicates that some translations are missing, which could affect the internationalization of the component.
Would you like me to help identify the missing translations and create a GitHub issue to track this task?
Let's verify the missing translations:
…7390) * Clean up alkemio avatar component The goal is to remove `@mui/styles`, but as the component is deprecated, it is replaced with the new avatar component in the user popup and the deprecated component is cleaned up from all unused features. The user popup is inlined in it to simplify more the interface of the component.
* fix forum discussion styles * update contributors image for unauth users and fix styles (#7354) * update contributors image for unauth users and fix styles * resolve pr comments * Remove location from VC card * remove usage of anonymousReadAccess (#7332) * Fix dashboard access (#7360) * Fix dashboard access * fixed scope * change polling interval * fix pr comment * renamed to useSpaceTemplate*s*ManagerQuery --------- Co-authored-by: Carlos Cano <carlos@alkem.io> * Handling of scroll and page change in documentation. (#7359) * logs for the frame origin * add allow-scripts to the docs iframe * Improve the layout banner of Documentation page; * Subtitle for the Docs page * added new tabs to user + org admin pages; refactored contributor admin pages (#7367) * added new tabs to user + org admin pages; refactored how admin pages for users + orgs + vcs are managed; moved some global admin functionality out of domain down to platform admin; ... * updated generation to match api tidy ups related to set of preference types + ID passing for org mutations * fix compile errors related to dropping of separate UserPreferenceType enum * Synchronize icons, remove comments, make sure there are no redundant settings calls. * Links & Docs to BoK on VC creation (#7365) * VC documents and links BoK - refactor the AddContent * VC documents and links implementation without validation; * resolve rabbit comments --------- Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> Co-authored-by: reactoholic <petar.georgiev.kolev@gmail.com> * Links and Docs - forgotten commit with Validation (#7377) * CalloutsSet entity (#7376) * codegen passing with updated api * fixed api + codegen passes * code compiling * pick up create callout privilege from the CalloutsSet * callouts showing up after creation * retrieving of callouts using only calloutsSet ID * moved code around to have notion of calloutsSet in tree * fix array dep breaking tool creation; small code optimizations; --------- Co-authored-by: bobbykolev <bobbykolev@abv.bg> * split useCallouts into also useCalloutsOnCollaboration (#7378) * Style UserAvatar tooltip (#7384) * Fix: Deleting subspace l2 from its settings throws errors on space dashboard * InnovationFlow States names validation - no commas (#7391) * Add arcadeSoftware to the whitelist of iframes (#7397) * bump client version (#7403) * implement image pasting in md editor (#7387) * codegen compilation * Fix: ENTITY_NOT_FOUND Error is triggered after first login server#4790 (#7396) * Remove `makeStyles` from `AlkemioAvatar` and `CommunityUpdatesView` (#7390) * Clean up alkemio avatar component The goal is to remove `@mui/styles`, but as the component is deprecated, it is replaced with the new avatar component in the user popup and the deprecated component is cleaned up from all unused features. The user popup is inlined in it to simplify more the interface of the component. * update contributors image for unauth user (#7410) * bug fix: verified label overlaps with text (#7415) * removed usage of AuthorizationCredential, replaced with RoleName; removed usage of UserGroups * added label to issue templates (#7425) * Limit the answers length on ApplicationForm (#7419) * Limit the answers length on ApplicationForm * Fix error message --------- Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> * Display account entitlements (#7414) * wip * removed state from some dialogs --------- Co-authored-by: Carlos Cano <carlos@alkem.io> * Fix: ENTITY_NOT_FOUND Error is triggered after first login server#4790 (#7396) * Remove `makeStyles` from `AlkemioAvatar` and `CommunityUpdatesView` (#7390) * Clean up alkemio avatar component The goal is to remove `@mui/styles`, but as the component is deprecated, it is replaced with the new avatar component in the user popup and the deprecated component is cleaned up from all unused features. The user popup is inlined in it to simplify more the interface of the component. * update contributors image for unauth user (#7410) * bug fix: verified label overlaps with text (#7415) * added label to issue templates (#7425) * Limit the answers length on ApplicationForm (#7419) * Limit the answers length on ApplicationForm * Fix error message --------- Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> * Display account entitlements (#7414) * wip * removed state from some dialogs --------- Co-authored-by: Carlos Cano <carlos@alkem.io> * update contributors image for unauth user (#7410) * first pass fixing * second pass * Third pass * 6 errors left * Removing scary words in translation.en.json (#7432) * moved to using UUIDs * Add Updates from leads block to the subspaces page (l1 & l2). (#7417) * Add Updates from leads block to the subspaces page (l1 & l2). * share url --------- Co-authored-by: Carlos Cano <carlos@alkem.io> * Fix Sidebar list of spaces not refreshing after subspace delete (#7418) Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> * fix * [VC] Knowledge base instead of Subspace BoK in Written Knowledge step (#7381) * added new tabs to user + org admin pages; refactored how admin pages for users + orgs + vcs are managed; moved some global admin functionality out of domain down to platform admin; ... * updated generation to match api tidy ups related to set of preference types + ID passing for org mutations * fix compile errors related to dropping of separate UserPreferenceType enum * Synchronize icons, remove comments, make sure there are no redundant settings calls. * Links & Docs to BoK on VC creation (#7365) * VC documents and links BoK - refactor the AddContent * VC documents and links implementation without validation; * resolve rabbit comments --------- Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> Co-authored-by: reactoholic <petar.georgiev.kolev@gmail.com> * Links and Docs - forgotten commit with Validation (#7377) * CalloutsSet entity (#7376) * codegen passing with updated api * fixed api + codegen passes * code compiling * pick up create callout privilege from the CalloutsSet * callouts showing up after creation * retrieving of callouts using only calloutsSet ID * moved code around to have notion of calloutsSet in tree * fix array dep breaking tool creation; small code optimizations; --------- Co-authored-by: bobbykolev <bobbykolev@abv.bg> * VC knowledge base instead of subspace init * Space creation after VC creation, loading, code opt & reorganization * Fix docs uploading, code organization and documentation; * fix uploading of docs in case there's no space under the acc; remove misleading createdSpaceId usage; * useLoadingState instead of a new React State * Fix - set properly the persona type depending on the 3 steps; * Ability to select SpaceLevel2 on create VC (#7386) * VC Knowledge Base callouts dialog (#7388) * VC Knowledge Base callouts dialog - init. * Filter available callout types. * disable rich media on VC callout creation. * Description component with update functionality. * Update the Create Written Knowledge UI and initial state; Fix dialog titles in VC flow. * Reingest logic in the Knowledge dialog. * Remove the icon logic for CalloutVisibilityChangeDialog. * Use the account hostname for space created in the VC flow. * fix VC dialog not opening; remove outdated copy; * storage config for KnowledgeBase description --------- Co-authored-by: Neil Smyth <neil@thesmyths.eu> Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> Co-authored-by: reactoholic <petar.georgiev.kolev@gmail.com> Co-authored-by: Neil Smyth <30729240+techsmyth@users.noreply.github.com> Co-authored-by: Carlos Cano <carlos@alkem.io> * add cspell config (#7404) * resolveIds returns string and not the entity * proper check for available account for the vc flow (#7433) * VirtualContributor fixes * name ids * updated for renamed mutation * Client web/7416 disable image pasting when hide image options flag is true (#7428) * fix organization verified sign font size by simone's ask * disable image pasting if hideImageOptions flag is true * optimize paste handler * resolve pr comment * Extract the isImageOrHtmlWithImage and call it once per item. --------- Co-authored-by: Bobby Kolev <bobbykolev@abv.bg> * Fix can't add callout to VC KnowledgeBase. (#7437) Co-authored-by: Valentin Yanakiev <valentin.yanakiev@gmail.com> * url resolver * url builders * Create space link entitlements (#7442) * check for entitlements in the CreateSpaceLink (cherry picked from commit aed1830) * 0.79.7 (cherry picked from commit 7ec232c) * updated to work with fields for entryRole + elevatedRole availability * MD fixes - comments not visible with long Post description; `pre` long line not visible; (#7435) * move fragment * missing padding for the items on the left block on space and subspaces (#7448) * Optimize the Contributor Account Tab and VC flow (#7444) * Optimize subspace query under acc. Fix first VC/Space flow resulting in errors. * Fix add to community and navigation related to spaceId * polishing * fix navigation of subspaces * Optimize the main vcWizard account call. * pr fix --------- Co-authored-by: Carlos Cano <carlos@alkem.io> * Admin Roles management * Available users search. Organizations auth using rolesetAdmin * Organization roles management * fix style * clean up. first 0 errors * removed usage of platform role set id on mutations for roles on platform as not needed (only one) * check for the correct privilege for Callout creation * Add checkbox for adding tutorials when creating new space and fix UI issue in Mozilla regarding the URL input (#7447) * updated for adjusted privilege names * [VC Flow] Choose community step (#7457) * choose community step in vc flow * fix data reload on home dash; * refetch the BoK after VC callouts creation * Append visuals to create profile input (#7301) * profileData renamed to profile on CreateWhiteboardInput * Removed visualUrl from post, which doens't make sense on creation * graphical tweak and little rename * Fix #7316 Create template permission (#7319) * Filter file extensions robustly (#7326) * Fix creating a subspace on a Space by nameId (#7328) * Fix creating a subspace on a Space by nameId * remove unused var * Fix Tutorials Iframes (#7323) * Fix tutorials iframes * parse the iframe with the DOMParser instead of with regex --------- Co-authored-by: Valentin Yanakiev <valentin.yanakiev@gmail.com> * Add Callouts preview accordion on SubspacesList default subspace template selector (#7325) * Add Callouts preview accordion on SubspacesList default subspace template selector * usememo * memoize the Description component --------- Co-authored-by: Valentin Yanakiev <valentin.yanakiev@gmail.com> * codegen --------- Co-authored-by: Valentin Yanakiev <valentin.yanakiev@gmail.com> * restrict activities block to 10 results and add activities dialog (#7463) * Handle missing privileges for add VC to community. (#7470) * Fix the save as template option missing due to missing array deps (#7476) * Remove nameIds from VC dialogs * Entitlements view based on permissions and limits (#7467) * Fix #7451 * Common component to handle the --------- Co-authored-by: Svetoslav Petkov <svetoslav@alkem.io> * display usage-limit of spaces in the account page (#7468) * display usage-limit of spaces in the account page * making safer check --------- Co-authored-by: Svetoslav Petkov <svetoslav@alkem.io> * removed another url builder * Remove SpaceRoleSetContributorTypes query and a few unused queries more * Fix innovationHubs * Fix add checkbox for tutorials UI bug (#7466) * fix add checkbox for tutorials ui * restore graphql files --------- Co-authored-by: Bobby Kolev <bobbykolev@abv.bg> * Fix first-child + useEffect dynamic deps array length console errors; (#7477) Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> * Bug fix: search bar in spaces page not working, and page refreshes on search term enter (#7462) * search spaces page not working * visualize subspaces as well * resolve pr comment * resolve pr comment * fix missing callouts in create template preview (#7482) Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> * Fix organization provider * clean * Rename files * Removed variables from notification query (#7481) * First pass removing useCommunityAdmin * rename forlder * wip * VC Flow - proper filtering of Existing Spaces (#7490) * apply multiple filters on space activities (#7489) Co-authored-by: Bobby Kolev <bobbykolev@abv.bg> * Available users/orgs/vcs hook * support knowledge-base route on VC profile (#7480) * fix nameId issue on VC profile * fix userNameId issues on UserProfile * a bit of cleanup. 0 errors again * fix paste issue (#7493) * removing fragment CommunityRoleSetDetails * clean up * Moved files * Remove groups * VC Flow - proper filtering of Existing Spaces (#7490) * apply multiple filters on space activities (#7489) Co-authored-by: Bobby Kolev <bobbykolev@abv.bg> * support knowledge-base route on VC profile (#7480) * fix paste issue (#7493) * VC Flow - proper filtering of Existing Spaces (#7490) * UserPage clean nameId * Removed some unused code * ApplicationDialog * invitations in RolesetAdmin * Delete more group things * updatePreference mutation * remove useInviteUsers * fix md editor typing issue (#7501) * small refactor * no space creation when org has no spaces and vc is created * refetch * Account storage config for the account resources (#7486) * use account storage config for entities under the account (instead userStorage) * refactor a bit --------- Co-authored-by: Carlos Cano <carlos@alkem.io> * disable new posts on knowledgebase callouts (#7507) * knowledgebase-disable-new-posts (#7509) * No default callouts on space creation w tutorials (#7518) * update graphql schema * Add VC Callouts route (#7515) * Url for posts that are inside VC knowledge-base * fix url resolver * 0.80.0 (#7526) * reingest after creation of a VC with Space BoK (#7536) * 0.80.1 * BugFix anonymous user access to public space (#7541) * crowdin config (#7549) * Fix search in space (#7552) * Fix search in space * Also use the lookup for space details * Translations (#7553) * 0.80.2 * disabled Crowdin action --------- Co-authored-by: reactoholic <petar.georgiev.kolev@gmail.com> Co-authored-by: Petar Kolev <33326233+reactoholic@users.noreply.github.com> Co-authored-by: Carlos Cano <carlos@alkem.io> Co-authored-by: Neil Smyth <30729240+techsmyth@users.noreply.github.com> Co-authored-by: Valentin Yanakiev <valentin.yanakiev@gmail.com> Co-authored-by: Neil Smyth <neil@thesmyths.eu> Co-authored-by: Todorka Halacheva <56818790+thalacheva@users.noreply.github.com> Co-authored-by: Svetoslav Petkov <svetoslav@alkem.io> Co-authored-by: Simone <38861315+SimoneZaza@users.noreply.github.com> Co-authored-by: Evgeni Dimitrov <comoque@gmail.com>
Describe the background of your pull request
As the
AlkemioAvatar
component is deprecated, it is replaced with the new avatar component in the user popup and the deprecated component is cleaned up from all unused features. The user popup is inlined in it to simplify more the interface of the component.As part of this PR, the deprecated AlkemioAvatar was completely removed.
Note that it had an outdated popup functionality showing the details of a user in modal. The functionality is preserved on the Organization admin groups, but it was removed from the Community Lead updates admin section. Now the avatar is just a link to the profile.
Governance
By submitting this pull request I confirm that:
https://github.com/alkem-io/Coordination/blob/master/LICENSE.
Summary by CodeRabbit
Release Notes
Bug Fixes
AlkemioAvatar
component, addressing potential issues with avatar rendering.New Features
Refactors
Chores
The updates focus on improving component flexibility, styling consistency, and user interface interactions across various parts of the application.