fix/username-limits (#468)

* feat: added new selectors * feat: Upload button selector ids * feat: Input and Select selector ids * feat: User List table selector ids * fix: MultipleSelect rename selector ids * fix: Rename Upload component selctor ids * feat: Modal action buttons selector ids-Add member and Upload constitution * feat: AdminTopNav Search component selector id * feat: Admin signout & modal selector ids * feat: AdminTopNav buttons selector ids * feat: Navigation links selector ids * Feat: Footer selector ids * feat: Constitution page selector ids * feat: Latest updates and votes selector ids * feat: GA table selector ids * fix dockle scan on ci * fix registry login * debug imgs * scan tar imgs * test * add tar cleanup * test * pr workflow fix * declutter dockle * add comment * add microservice in pr comment * test w/ individual service failing * fix dockerfile * fix: vote table row responsiveness * Refactor/change logic for file upload to S3 (#328) * refactor: changed getFileUrl function in order to display images on website for longer than 7 days * refactor: changed getFileUrl function in order to display images on website for longer than 7 days * feat: dht-queue (#336) Added persistent dht-queue which will be responsible for publishing cid to dht * refactor: image upload to S3 (#337) * fitx/rationale-governance-format Rationale - Removed body.references since it will be empty until CC-portal enables that feature GAP title and abstract is now parsing in compatibility with CIP-0108 (body.title, body.abstract) * chore: change guides btn link * fix: rm-gap-title-abstract-len-constraint Remove len constraints for gap.title and gap.abstract (was 80 and 2500 char length) fixed error if db data is undefined when fetching from db sync * refactor: add redis username Added username env variable within backend/worker-service/ipfs-service * Fix add redis creds (#343) * feat: add redis user * fix: add config to worker-service * fix-add-redis-creds: fixed order within example.env * fix: add docker compose args --------- Co-authored-by: nike-getto <[email protected]> Co-authored-by: BEDev24 <[email protected]> * Fix add redis creds (#344) * feat: add redis user * fix: add config to worker-service * fix-add-redis-creds: fixed order within example.env * fix: add docker compose args * refactor: cache docker-compose --------- Co-authored-by: nike-getto <[email protected]> Co-authored-by: BEDev24 <[email protected]> * fix: typo * fix: typo * refactor: cache service * refactor/redis-auth (#345) * fix: plural grammar corrections * refactor: pruning worker processors (#346) * fix: latest updates content overlaping * refactor: ipfs service path and minor refactoring * fix: usersnap remove other buttons (#323) * fix: Overlapping on tables * fix: don't show top banner on mainnet * fix: show more btn not loading more content, update env example * refactor: renamed migration name for gap len constraint removal * refactor: ipfs volume * add correct vars (#352) Co-authored-by: nike-getto <[email protected]> * fix: ipfs-redis-service (#360) * fix/ipfs-redis-service: tls connection to redis * fix/ipfs-redis-service: tls connection to redis * fix/gov-search-rationale-votes: user votes and rationale are being checked when data is fetched (#359) Co-authored-by: BEDev24 <[email protected]> * fix: usersnap showing all on path change * fix: Remove comments for selector ids * fix: Usersnap query params issue * fix/logging-magic-link: disabled mailing on local (#363) * fix: search not unchecking filters after clicking on clear * fix/add-indexes-to-searchable-columns: added indexes to searcable columns in the database (#394) * feat: resend register invite (#397) * feature/resend-register-invite: added endpoint for resending the register invite * feature/resend-register-invite: minor changes * feature/resend-register-invite: minor changes * feat: resend invitation, inactive/active, hard delete * feature/hard-delete-user: added hard delete user ability (#398) * Feat: hard delete user (#400) * feature/hard-delete-user: added hard delete user ability * feature/hard-delete-user: updated swagger * feat: hard delete user (#401) * feature/hard-delete-user: added hard delete user ability * feature/hard-delete-user: updated swagger * feature/hard-delete-user: try catch for removing profile photo * feat: implement delete user * chore: refactor delete button component * test/remove-users: added unit tests (#406) * fix/sorting-users: sorted users by name in ascending order (#408) * feat: add switch user modal and remove X button from role bar on admin dashboard * fix: allow super admin to change status of cc memeber * fix/sync-votes: sync vote rationale url (#412) * fix: sync votes (#418) * fix/sync-votes: sync vote rationale url * fix/sync-votes: fixed unit tests * feat: constitution page design improvements * refactor/open-port-3002 * added rationale link on latest updates table * refactor/worker-bull-borad * feat: implemented new contents design * fix: contents scroll * fix: navigation side bar visual known issues * fix: tooltip not showing on accordion summary * fix: tooltip not showing on accordion summary * fix/change-user-name-validation: Endabled character | (pipe) in the user name (#443) * fix: highlight selected heading in contents and fix layout issues on small device screens * feat: add loader and registration username validation * feat: merge ga and rationale modals and add links to footer * chore: return deleted modal * fix/bullmq-redis-reconnect: added option reconnect on error (#449) * fix: changed tabs design, date formating, removed cta on memebers card, add guardrails btn on landing page * fix: ga modal showing wrong date * fix: handle date foramting types * fix: resolve vertical shifting of table rows in the latest updates * fix: members card description overlapping * feat: add guardrails rationale button * fix: constitution upload btn text overlap * fix: toc overlapping constitution on smaller screens * fix: lengthen user profile name * feat: rationale cip-136 (#462) * feature/rationale-cip-136: rationale json according cip-136 * feature/reationale-cip-136: polish unit test * chore: rationale cip-136 (#464) * feature/rationale-cip-136: rationale json according cip-136 * feature/reationale-cip-136: polish unit test * feature/reationale-cip-136: minor changes * fix: limit for users name (#465) * fix/limit-for-users-name: users name limited to 64 characters * fix/limit-for-users-name: users name limited to 64 characters * fix: redirect admin to main home page after signing out * Revert rationale-cip-136 (#467) * feature/rationale-cip-136: rationale json according cip-136 * feature/reationale-cip-136: polish unit test * feature/reationale-cip-136: minor changes * Revert "feature/rationale-cip-136: rationale json according cip-136" This reverts commit c5d3b8a. * Revert "Revert "feature/rationale-cip-136: rationale json according cip-136"" This reverts commit 4201690. * Revert "Revert "Revert "feature/rationale-cip-136: rationale json according cip-136""" This reverts commit 148ebbb. --------- Co-authored-by: nikolajovancevic <[email protected]> Co-authored-by: Kristina <[email protected]> Co-authored-by: Baja-KS <[email protected]> Co-authored-by: Lazar Lukić <[email protected]> Co-authored-by: Vojimirovich <[email protected]> Co-authored-by: Vojimirovich <[email protected]> Co-authored-by: nike-getto <[email protected]> Co-authored-by: BEDev24 <[email protected]> Co-authored-by: kubet <[email protected]> Co-authored-by: Kristina <[email protected]> Co-authored-by: Vojimirovich <[email protected]>
IntersectMBO · Nov 20, 2024 · e0ce14c · e0ce14c
1 parent 34f985f
commit e0ce14c
Show file tree

Hide file tree

Showing 24 changed files with 380 additions and 317 deletions.
diff --git a/.github/workflows/pr.yaml b/.github/workflows/pr.yaml
@@ -123,7 +123,7 @@ jobs:
             NEXT_PUBLIC_USERSNAP_PROJECT_API_KEY=${{ secrets.QA_NEXT_PUBLIC_USERSNAP_PROJECT_API_KEY }}
             NEXT_PUBLIC_HIDDEN_USERSNAP_PROJECT_IDS=${{ secrets.QA_NEXT_PUBLIC_HIDDEN_USERSNAP_PROJECT_IDS }}
             NEXT_PUBLIC_IS_MAINNET=${{ secrets.QA_NEXT_PUBLIC_IS_MAINNET }}
-            
+
       - name: Scan Docker image with Dockle
         id: dockle
         run: |

diff --git a/backend/migrations/1731932955459-limit-users-name-field.ts b/backend/migrations/1731932955459-limit-users-name-field.ts
@@ -0,0 +1,17 @@
+import { MigrationInterface, QueryRunner } from 'typeorm';
+
+export class LimitUsersNameField1731932955459 implements MigrationInterface {
+  name = 'LimitUsersNameField1731932955459';
+
+  public async up(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "users" ALTER COLUMN "name" TYPE varchar(64)`,
+    );
+  }
+
+  public async down(queryRunner: QueryRunner): Promise<void> {
+    await queryRunner.query(
+      `ALTER TABLE "users" ALTER COLUMN "name" TYPE varchar(50)`,
+    );
+  }
+}
diff --git a/backend/src/governance/api/governance.controller.ts b/backend/src/governance/api/governance.controller.ts
@@ -133,8 +133,8 @@ export class GovernanceController {
     description: 'Unauthorized',
   })
   @ApiResponse({
-    status: 409,
-    description: 'Rationale already exists for this user',
+    status: 400,
+    description: 'Bad Request',
   })
   @UseGuards(JwtAuthGuard, UserPathGuard)
   @Post('users/:id/proposals/:proposalId/rationale')

diff --git a/backend/src/governance/facade/governance.facade.spec.ts b/backend/src/governance/facade/governance.facade.spec.ts
@@ -119,22 +119,21 @@ describe('GovernanceFacade', () => {
   ];
 
   const mockRationaleRequest: RationaleRequest = {
-    title: 'Rationale title',
-    content: 'Rationale content',
+    summary: 'Rationale title',
+    rationaleStatement: 'Rationale content',
   };
 
   const mockRationaleJson = {
     govActionProposalHash: mockGovActionProposalDtos[0].txHash,
-    title: mockRationaleRequest.title,
-    content: mockRationaleRequest.content,
+    title: mockRationaleRequest.summary,
+    content: mockRationaleRequest.rationaleStatement,
   };
 
   const mockIpfsContentDto: IpfsContentDto = {
     blake2b: 'blake2b_example',
     cid: 'cid_example',
     url: 'ipfs_url_example',
-    title: mockRationaleRequest.title,
-    contents: mockRationaleRequest.content,
+    contents: mockRationaleRequest.rationaleStatement,
   };
 
   const mockGovActionProposals: GovActionProposal[] = [
@@ -215,8 +214,8 @@ describe('GovernanceFacade', () => {
     {
       userId: mockUsers[0].id,
       govActionProposalId: mockGovActionProposals[0].id,
-      title: 'Rationale title 1',
-      content: 'Rationale content 1',
+      summary: 'Rationale title 1',
+      rationaleStatement: 'Rationale content 1',
       cid: 'cid1',
       blake2b: 'blake2b1',
       url: 'http://test.com',
@@ -225,8 +224,8 @@ describe('GovernanceFacade', () => {
     {
       userId: mockUsers[0].id,
       govActionProposalId: mockGovActionProposals[1].id,
-      title: 'Rationale title 2',
-      content: 'Rationale content 2',
+      summary: 'Rationale title 2',
+      rationaleStatement: 'Rationale content 2',
       cid: 'cid2',
       blake2b: 'blake2b2',
       url: 'http://test.com',

diff --git a/backend/src/governance/services/governance.service.spec.ts b/backend/src/governance/services/governance.service.spec.ts
@@ -16,6 +16,7 @@ import { VoteValue } from '../enums/vote-value.enum';
 import { User } from 'src/users/entities/user.entity';
 import { UserStatusEnum } from 'src/users/enums/user-status.enum';
 import { RoleEnum } from 'src/users/enums/role.enum';
+import { RationaleDto } from '../dto/rationale.dto';
 
 describe('IpfsService', () => {
   let service: GovernanceService;
@@ -53,11 +54,11 @@ describe('IpfsService', () => {
     },
   ];
 
-  const mockRationaleDto = {
+  const mockRationaleDto: RationaleDto = {
     userId: 'mockedId',
     govActionProposalId: '1',
-    title: 'Rationale title',
-    content: 'Rationale content',
+    summary: 'Rationale title',
+    rationaleStatement: 'Rationale content',
     cid: 'rationalecid',
     blake2b: 'rationaleblake2b',
     url: 'rationaleurl',

diff --git a/backend/src/users/api/request/update-user.request.ts b/backend/src/users/api/request/update-user.request.ts
@@ -14,7 +14,7 @@ export class UpdateUserRequest {
     example: 'John Doe',
   })
   @MinLength(2, { message: `Minimum character length is 2` })
-  @MaxLength(30, { message: `Maximum character length is 30` })
+  @MaxLength(64, { message: `Maximum character length is 64` })
   @Matches(/^[a-zA-Z0-9_|.\s]+$/, {
     message: `Name can't contain special characters & symbols`,
   })

diff --git a/backend/src/users/entities/user.entity.ts b/backend/src/users/entities/user.entity.ts
@@ -25,7 +25,7 @@ export class User extends CommonEntity {
   @Column({
     name: 'name',
     type: 'varchar',
-    length: 50,
+    length: 64,
     nullable: true,
   })
   name: string;

diff --git a/frontend/messages/de.json b/frontend/messages/de.json
@@ -5,6 +5,8 @@
       "headline": "Wir setzen uns für die von der Community geführte Governance von Cardano ein",
       "description": "Bis eine endgültige Cardano-Verfassung entwickelt und von der Community ratifiziert wurde – ein Konsultationsprogramm, das das ganze Jahr 2024 über läuft – ist eine Reihe von Übergangsregeln erforderlich, um den Übergang zu unterstützen.",
       "seeConstitution": "Lesen Sie die Interimsverfassung",
+      "guardrailsScript": "Guardrails Script",
+      "guardrailsRationale": "Guardrails Rationale",
       "signIn": "Anmelden",
       "constitutionalCommitteePortal": "Portal des Verfassungsausschusses"
     }

diff --git a/frontend/messages/en.json b/frontend/messages/en.json
@@ -5,6 +5,8 @@
       "headline": "Championing Cardano's community-led governance",
       "description": "Until a final Cardano Constitution has been developed and ratified by the community - a programme of consultation taking place throughout 2024 - a set of interim rules is required to support the transition.",
       "seeConstitution": "Read the Interim Constitution",
+      "guardrailsScript": "Guardrails Script",
+      "guardrailsRationale": "Guardrails Rationale",
       "signIn": "Sign In",
       "constitutionalCommitteePortal": "Constitutional Committee Portal"
     }

diff --git a/frontend/src/components/atoms/UploadFileButton.tsx b/frontend/src/components/atoms/UploadFileButton.tsx
@@ -1,6 +1,7 @@
 "use client";
 import { Button } from "@atoms";
 import { ICONS } from "@consts";
+import { Box } from "@mui/material";
 import { useState } from "react";
 import { FormErrorMessage } from "./FormErrorMessage";
 import { ButtonProps, FormErrorMessageProps } from "./types";
@@ -43,14 +44,24 @@ export const UploadFileButton = ({
         onChange={fileChange}
         data-testid={`${dataTestId}-input`}
       />
-      <Button
-        startIcon={<img src={ICONS.upload} />}
-        component="span"
-        data-testid={`${dataTestId}-button`}
-        {...buttonProps}
-      >
-        {children} {selectedFile && selectedFile.name}
-      </Button>
+      <Box sx={{ display: "flex" }}>
+        <Button
+          startIcon={<img src={ICONS.upload} />}
+          component="span"
+          data-testid={`${dataTestId}-button`}
+          {...buttonProps}
+        >
+          <Box
+            sx={{
+              overflow: "hidden",
+              textOverflow: "ellipsis",
+              whiteSpace: "nowrap"
+            }}
+          >
+            {selectedFile && selectedFile.name ? selectedFile.name : children}
+          </Box>
+        </Button>
+      </Box>
       <FormErrorMessage errorMessage={errorMessage} errorStyles={errorStyles} />
     </label>
   );

diff --git a/frontend/src/components/molecules/UserCard/UserBasicInfo.tsx b/frontend/src/components/molecules/UserCard/UserBasicInfo.tsx
@@ -1,15 +1,15 @@
+import { Tooltip, Typography } from "@atoms";
 import { IMAGES } from "@consts";
-import { Typography, Tooltip } from "@atoms";
-import { Grid } from "@mui/material";
+import { Box, Grid } from "@mui/material";
 import { getShortenedGovActionId, truncateText } from "@utils";
-import { CopyPill } from "../CopyPill";
 import ConditionalWrapper from "../ConditionalWrapper";
+import { CopyPill } from "../CopyPill";
 
 export const UserBasicInfo = ({
   name,
   email,
   hotAddress,
-  maxWidth = 300,
+  maxWidth = 300
 }: {
   name: string;
   email?: string;
@@ -22,14 +22,17 @@ export const UserBasicInfo = ({
       paddingRight: 3,
       width: { xxs: "auto", md: maxWidth },
       height: "100%",
+      textAlign: { xxs: "center", sm: "left" }
     }}
     px={{ xxs: 1, lg: 3 }}
+    display="flex"
+    flexDirection="column"
   >
     <Typography
       sx={{
         marginBottom: 0.5,
         minHeight: 24,
-        width: "100%",
+        width: { xxs: "auto", md: maxWidth }
       }}
       dataTestId="user-info-username-text"
       variant="body1"
@@ -56,10 +59,12 @@ export const UserBasicInfo = ({
       </ConditionalWrapper>
     )}
     {hotAddress && (
-      <CopyPill
-        copyValue={hotAddress}
-        copyText={getShortenedGovActionId(hotAddress)}
-      />
+      <Box display="flex">
+        <CopyPill
+          copyValue={hotAddress}
+          copyText={getShortenedGovActionId(hotAddress)}
+        />
+      </Box>
     )}
   </Grid>
 );
diff --git a/frontend/src/components/molecules/UserProfileButton.tsx b/frontend/src/components/molecules/UserProfileButton.tsx
@@ -1,16 +1,16 @@
 "use client";
-import * as React from "react";
-import Menu from "@mui/material/Menu";
+import { FetchUserData } from "@/lib/requests";
 import { ICONS, IMAGES, PATHS } from "@consts";
-import { Button } from "../atoms";
 import { useModal } from "@context";
-import { FetchUserData } from "@/lib/requests";
-import { useTranslations } from "next-intl";
-import { Grid, Hidden } from "@mui/material";
 import { UserAvatar } from "@molecules";
+import { Grid, Hidden, Tooltip } from "@mui/material";
+import Menu from "@mui/material/Menu";
+import { useTranslations } from "next-intl";
+import * as React from "react";
+import { Button } from "../atoms";
 
 export default function UserProfileButton({
-  user,
+  user
 }: {
   user: Pick<FetchUserData, "name" | "profile_photo_url">;
 }) {
@@ -31,8 +31,8 @@ export default function UserProfileButton({
       type: "signUpModal",
       state: {
         showCloseButton: true,
-        title: t("Modals.editProfile.headline"),
-      },
+        title: t("Modals.editProfile.headline")
+      }
     });
     handleClose();
   };
@@ -41,11 +41,12 @@ export default function UserProfileButton({
     openModal({
       type: "signOutModal",
       state: {
-        homeRedirectionPath: PATHS.home,
-      },
+        homeRedirectionPath: PATHS.home
+      }
     });
   };
 
+  const USERNAME_MAX_LENGTH = 32;
   return (
     <>
       <Hidden mdDown>
@@ -67,7 +68,18 @@ export default function UserProfileButton({
           endIcon={<img width={20} height={20} src={ICONS.chevronDown} />}
           dataTestId="user-profile-menu-button"
         >
-          {user?.name || "User"}
+          <Tooltip
+            title={user?.name?.length > USERNAME_MAX_LENGTH ? user.name : ""}
+            placement="top"
+            disableFocusListener
+            disableTouchListener
+          >
+            <span>
+              {user?.name?.length > USERNAME_MAX_LENGTH
+                ? `${user.name.slice(0, USERNAME_MAX_LENGTH)}...`
+                : user?.name || "User"}
+            </span>
+          </Tooltip>
         </Button>
 
         <Menu
@@ -76,10 +88,10 @@ export default function UserProfileButton({
           open={open}
           onClose={handleClose}
           MenuListProps={{
-            "aria-labelledby": "basic-button",
+            "aria-labelledby": "basic-button"
           }}
           PaperProps={{
-            style: { boxShadow: "none" },
+            style: { boxShadow: "none" }
           }}
         >
           <Grid

diff --git a/frontend/src/components/organisms/Constitution/Constitution.tsx b/frontend/src/components/organisms/Constitution/Constitution.tsx
@@ -26,9 +26,9 @@ import { TocAccordion } from "./TOCAccordion";
 import TOCLink from "./TOCLink";
 
 export function Constitution({ constitution, metadata }: ConstitutionProps) {
-  const { isMobile } = useScreenDimension();
+  const { screenWidth } = useScreenDimension();
   const [isOpen, setIsOpen] = useState(true);
-
+  const isMobile = screenWidth < 1025;
   const t = useTranslations("Constitution");
 
   useEffect(() => {
@@ -55,12 +55,7 @@ export function Constitution({ constitution, metadata }: ConstitutionProps) {
           <ConstitutionSidebar tableOfContents={children} metadata={metadata} />
         </DrawerMobile>
       ) : (
-        <NavDrawerDesktop
-          isOpen={isOpen}
-          onClick={() => setIsOpen(!isOpen)}
-          top={{ xxs: 0, md: 85 }}
-          left={0}
-        >
+        <NavDrawerDesktop top={{ xxs: 0, md: 85 }} left={0}>
           <ConstitutionSidebar tableOfContents={children} metadata={metadata} />
         </NavDrawerDesktop>
       ),
@@ -97,27 +92,25 @@ export function Constitution({ constitution, metadata }: ConstitutionProps) {
       data-testid="constitution-page-wrapper"
       container
       position="relative"
-      justifyContent={{ xxs: "flex-start" }}
+      justifyContent={{ xxs: "center", lg: "flex-start" }}
       flex={1}
     >
-      {/* fake elemnt to push content to the right since tos is fixed on left */}
-      <Box
-        height={{ xss: "0", md: "100%" }}
-        width={{ xss: "0", md: "420px" }}
-        zIndex={-1}
+      <Grid
+        mt={3}
+        item
+        xxs={12}
+        md={isOpen ? 8 : 11}
+        ml={{ xxs: 0, lg: "404px" }}
       >
-        &nbsp;
-      </Box>
-      <Grid mt={3} item xxs={12} md={isOpen ? 8 : 11}>
         <Box display="flex" flexDirection="column" flex={1}>
           <ContentWrapper>
-            <Box px={{ xxs: 3, md: 5 }}>
+            <Box px={{ xxs: 3, lg: 5 }}>
               <Box
                 display="flex"
                 justifyContent="space-between"
                 alignItems="center"
-                position={{ xxs: "sticky", md: "static" }}
-                top="72px"
+                position={{ xxs: "sticky", lg: "static" }}
+                top={{ xxs: "72px", md: "104px" }}
                 bgcolor={customPalette.bgWhite}
               >
                 <Typography variant="headline4">{t("title")}</Typography>
@@ -126,7 +119,7 @@ export function Constitution({ constitution, metadata }: ConstitutionProps) {
                   onClick={() => setIsOpen(true)}
                   sx={{
                     bgcolor: customPalette.arcticWhite,
-                    display: { xxs: "flex", md: "none" },
+                    display: { xxs: "flex", lg: "none" },
                     justifyContent: "center"
                   }}
                 >