Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,10 @@ export const MemberCard = ({
editText,
linkComponent: LinkComponent,
}: Props) => (
<article className="flex flex-col items-center relative px-20 py-40 border border-solid border-sc-card-standard-stroke rounded-[10px] shadow-[0_0_4px_0_rgba(0,0,0,0.05)]">
<article
aria-label={name}
className="bg-grey-0 flex flex-col items-center relative px-20 py-40 border border-solid border-sc-card-standard-stroke rounded-[10px] shadow-[0_0_4px_0_rgba(0,0,0,0.05)]"
>
<UserAvatar src={imageSrc} alt={name} className="w-[120px] h-[120px]" />
<Title className="py-10" variant="h6">
{name}
Expand Down
133 changes: 91 additions & 42 deletions web-marketplace/src/components/atoms/Link.tsx
Original file line number Diff line number Diff line change
@@ -1,5 +1,9 @@
'use client';
import React, { forwardRef, PropsWithChildren } from 'react';
import {
Link as ReactRouterLink,
LinkProps as ReactRouterLinkProps,
} from 'react-router-dom';
import { Box, Link as MuiLink, LinkProps as MuiLinkProps } from '@mui/material';
import NextLink, { LinkProps as NextLinkProps } from 'next/link';

Expand All @@ -10,60 +14,105 @@ export interface LinkProps extends MuiLinkProps, PropsWithChildren {
href: string;
}

type LinkRef = HTMLAnchorElement;
type CombinedLinkProps = Omit<
type ReactRouterLinkBehaviorProps = Omit<ReactRouterLinkProps, 'to'> & {
href: ReactRouterLinkProps['to'];
};

type NextLinkBehaviorProps = Omit<
React.AnchorHTMLAttributes<HTMLAnchorElement>,
keyof NextLinkProps
> &
NextLinkProps;

const LinkBehavior = React.forwardRef<LinkRef, CombinedLinkProps>(
(props, ref) => {
const { href, as, ...other } = props;
return <NextLink ref={ref} href={href} as={as} {...other} />;
},
);
const ReactRouterLinkBehavior = React.forwardRef<
HTMLAnchorElement,
ReactRouterLinkBehaviorProps
>(({ href, ...other }, ref) => {
return <ReactRouterLink ref={ref} to={href} {...other} preventScrollReset />;
});

const NextLinkBehavior = React.forwardRef<
HTMLAnchorElement,
NextLinkBehaviorProps
>((props, ref) => {
const { href, as, ...other } = props;
return <NextLink ref={ref} href={href} as={as} {...other} />;
});

// eslint-disable-next-line lingui/no-unlocalized-strings
LinkBehavior.displayName = 'LinkBehavior';
ReactRouterLinkBehavior.displayName = 'ReactRouterLinkBehavior';
// eslint-disable-next-line lingui/no-unlocalized-strings
NextLinkBehavior.displayName = 'NextLinkBehavior';
const createMuiLink = (
internalComponent: React.ElementType,
{ applyLocalePrefix = true }: { applyLocalePrefix?: boolean } = {},
) => {
const Component = forwardRef<HTMLAnchorElement, LinkProps>(
({ href, children, target, ...linkProps }, ref) => {
const locale = useCurrentLocale();
if (!href || typeof href !== 'string') {
return (
<Box {...linkProps} component="span">
{children}
</Box>
);
}

/**
* Renders a Material UI `Link` - will use Next Link for local links.
* Defaults to `target='_blank'` for external links.
*/
export const Link = forwardRef<HTMLAnchorElement, LinkProps>(
({ href, children, target, ...linkProps }, ref) => {
const locale = useCurrentLocale();
if (!href || typeof href !== 'string') {
// @ts-expect-error
return <Box {...linkProps}>{children}</Box>;
}
const isInternalLink = (href: string): boolean =>
!!href && href.startsWith('/');

const internalHref =
applyLocalePrefix && isInternalLink(href)
? ensureLocalePrefix(href, locale)
: href;

const isInternalLink = (href: string): boolean =>
!!href && href.startsWith('/');
// const hasAnchor = href?.includes('#');
return isInternalLink(href) ? (
<MuiLink
{...linkProps}
ref={ref}
component={internalComponent}
href={internalHref}
>
{children}
</MuiLink>
) : (
<MuiLink
{...linkProps}
ref={ref}
href={href}
target={target || '_blank'}
>
{children}
</MuiLink>
);
},
);

const withLocalePrefix = (href: string): string =>
isInternalLink(href) ? ensureLocalePrefix(href, locale) : href;
const internalName =
(internalComponent as React.ComponentType).displayName ||
(internalComponent as React.ComponentType).name ||
// eslint-disable-next-line lingui/no-unlocalized-strings
'Component';
// eslint-disable-next-line lingui/no-unlocalized-strings
Component.displayName = `MuiLink(${internalName})`;
return Component;
};

const internalHref = withLocalePrefix(href);
/**
* Renders a Material UI `Link` - will use React Router Link for local links.
* Defaults to `target='_blank'` for external links.
*/
export const ReactRouterMuiLink = createMuiLink(ReactRouterLinkBehavior, {
applyLocalePrefix: false,
});

return isInternalLink(href) ? (
<MuiLink
{...linkProps}
ref={ref}
component={LinkBehavior}
href={internalHref}
>
{children}
</MuiLink>
) : (
<MuiLink {...linkProps} ref={ref} href={href} target={target || '_blank'}>
{children}
</MuiLink>
);
},
);
/**
* Renders a Material UI `Link` - will use Next Link for local links.
* Defaults to `target='_blank'` for external links.
*/
export const Link = createMuiLink(NextLinkBehavior);

// eslint-disable-next-line lingui/no-unlocalized-strings
ReactRouterMuiLink.displayName = 'ReactRouterMuiLink';
// eslint-disable-next-line lingui/no-unlocalized-strings
Link.displayName = 'Link';
5 changes: 3 additions & 2 deletions web-marketplace/src/components/atoms/ScrollToTop.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { useEffect } from 'react';
import { usePathname } from 'next/navigation';

// List of route segments that should not trigger a scroll reset
const whitelist = ['ecocredit-batches'];
const whitelist = ['ecocredit-batches', 'profiles'];

/**
* Automatically scrolls the page to the top when navigating to a new route,
Expand All @@ -16,8 +16,9 @@ function ScrollToTop(): null {
const pathname = usePathname();

useEffect(() => {
if (!whitelist.some(route => pathname.includes(route)))
if (!whitelist.some(route => pathname.includes(route))) {
window.scrollTo(0, 0);
}
}, [pathname]);

return null; // No UI component, only side effect
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -73,6 +73,7 @@ export const useFetchBridgedEcocredits = ({ address }: Props): Output => {
client: queryClient,
enabled: !!queryClient,
request: {
// eslint-disable-next-line lingui/no-unlocalized-strings
query: `${messageActionEquals}'${MsgBridge.typeUrl}' AND message.sender='${address}'`,
orderBy: OrderBy.ORDER_BY_DESC,
},
Expand Down
Original file line number Diff line number Diff line change
@@ -1,5 +1,17 @@
import { Outlet } from 'react-router-dom';
import { Outlet, ScrollRestoration } from 'react-router-dom';

export const RegistryLayout = () => {
return <Outlet />;
return (
<>
<ScrollRestoration
getKey={(location, matches) => {
const profileMatch = matches.find(match =>
match.pathname.startsWith('/profiles/'),
);
return profileMatch ? profileMatch.pathname : location.key;
}}
/>
<Outlet />
</>
);
};
Original file line number Diff line number Diff line change
Expand Up @@ -100,6 +100,7 @@ export const BridgeFlow = ({
reactQueryClient.invalidateQueries({
queryKey: [
GET_TXS_EVENT_KEY,
// eslint-disable-next-line lingui/no-unlocalized-strings
`${messageActionEquals}'${MsgBridge.typeUrl}' AND message.sender='${wallet?.address}'`,
],
});
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -186,6 +186,11 @@ export const useCreateDao = () => {
key: 'organization_id',
value: params.organizationId,
});
// this is required to move s3 media from the current account to the new org folder
initialItems.push({
key: 'creator_account_id',
value: activeAccountId,
});
}

if (sanitizedBackgroundImage) {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export const MembersTab = () => {
return (
<WithLoader isLoading={isLoading}>
{organization ? (
<div className="grid grid-cols-1 sm:grid-cols-4 gap-4">
<div className="grid grid-cols-1 sm:grid-cols-4 gap-20">
{organization.daoByDaoAddress?.assignmentsByDaoAddress?.nodes.map(
assignment => {
const account = assignment?.accountByAccountId;
Expand Down
12 changes: 9 additions & 3 deletions web-marketplace/src/legacy-pages/Profile/Profile.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ import {
import { getProfileLink } from 'lib/profileLink';
import { useWallet } from 'lib/wallet/wallet';

import { Link } from 'components/atoms';
import { Link, ReactRouterMuiLink } from 'components/atoms';
import WithLoader from 'components/atoms/WithLoader';
import { useFetchPaginatedBatches } from 'hooks/batches/useFetchPaginatedBatches';
import { useQueryIsIssuer } from 'hooks/useQueryIsIssuer';
Expand Down Expand Up @@ -226,6 +226,12 @@ export const Profile = (): JSX.Element => {
socialsLinks,
};

const editLink = isOwnProfile
? organization
? '/dashboard/organization/profile'
: '/dashboard/profile'
: '';

return (
<WithLoader
isLoading={isLoading || isLoadingIsIssuer}
Expand All @@ -250,7 +256,7 @@ export const Profile = (): JSX.Element => {
backgroundImage={backgroundImage}
avatar={avatarImage}
infos={infos}
editLink={isOwnProfile ? '/dashboard/profile' : ''}
editLink={editLink}
profileLink={profileLink}
variant={
account?.type
Expand All @@ -271,9 +277,9 @@ export const Profile = (): JSX.Element => {
<IconTabs
aria-label={_(msg`public profile tabs`)}
tabs={tabs}
linkComponent={Link}
activeTab={activeTab}
mobileFullWidth
linkComponent={ReactRouterMuiLink}
/>
<div className="flex w-full md:w-auto mt-[30px] mb-7.5 md:mt-0 md:mb-0">
{manageButtonConfig.map(
Expand Down
Loading