diff --git a/src/features/Tournaments/pages/MakersPage/ConnectToMakerModal/ConnectToMakerModal.tsx b/src/features/Tournaments/pages/MakersPage/ConnectToMakerModal/ConnectToMakerModal.tsx
new file mode 100644
index 0000000..16e58eb
--- /dev/null
+++ b/src/features/Tournaments/pages/MakersPage/ConnectToMakerModal/ConnectToMakerModal.tsx
@@ -0,0 +1,81 @@
+import { motion } from 'framer-motion'
+import { ModalCard, modalCardVariants } from 'src/Components/Modals/ModalsContainer/ModalsContainer'
+import { FiGithub, FiLinkedin, FiTwitter } from "react-icons/fi";
+import { IoClose } from 'react-icons/io5';
+import { GetMakersInTournamentQuery } from 'src/graphql';
+import Avatar from 'src/features/Profiles/Components/Avatar/Avatar';
+import { withHttp } from 'src/utils/helperFunctions';
+
+
+interface Props extends ModalCard {
+ maker: GetMakersInTournamentQuery['getMakersInTournament']['makers'][number]
+}
+
+export default function LinkingAccountModal({ onClose, direction, maker, ...props }: Props) {
+
+
+ const links = [
+ {
+ hasValue: maker.twitter,
+ text: maker.twitter,
+ icon: FiTwitter,
+ colors: "bg-blue-100 text-blue-500",
+ url: `https://twitter.com/@${maker.twitter}`
+ },
+ {
+ hasValue: maker.github,
+ text: maker.github,
+ icon: FiGithub,
+ colors: "bg-pink-100 text-pink-600",
+ url: `https://github.com/${maker.github}`
+ },
+ {
+ hasValue: maker.linkedin,
+ text: "LinkedIn",
+ icon: FiLinkedin,
+ colors: "bg-sky-100 text-cyan-600",
+ url: maker.linkedin && withHttp(maker.linkedin),
+ }
+ ];
+
+
+ return (
+
+
+
+
Send team request 🤝
+
+
+
+
+
+
{maker.name}
+
{maker.jobTitle}
+
+
+
Team up with this maker by sending them a message on one of the following platforms.
+
+ {links.filter(link => link.hasValue).map((link, idx) =>
+
+
+ )}
+
+
+
+ )
+}
+
+
+
diff --git a/src/features/Tournaments/pages/MakersPage/ConnectToMakerModal/index.ts b/src/features/Tournaments/pages/MakersPage/ConnectToMakerModal/index.ts
new file mode 100644
index 0000000..1da3ce6
--- /dev/null
+++ b/src/features/Tournaments/pages/MakersPage/ConnectToMakerModal/index.ts
@@ -0,0 +1,3 @@
+import { lazyModal } from 'src/utils/helperFunctions';
+
+export const { LazyComponent: ConnectToMakerModal } = lazyModal(() => import('./ConnectToMakerModal'))
\ No newline at end of file
diff --git a/src/features/Tournaments/pages/MakersPage/MakerCard/MakerCard.tsx b/src/features/Tournaments/pages/MakersPage/MakerCard/MakerCard.tsx
index 1fe99c2..5fce987 100644
--- a/src/features/Tournaments/pages/MakersPage/MakerCard/MakerCard.tsx
+++ b/src/features/Tournaments/pages/MakersPage/MakerCard/MakerCard.tsx
@@ -5,6 +5,7 @@ import Card from 'src/Components/Card/Card';
import Avatar from 'src/features/Profiles/Components/Avatar/Avatar';
import Badge from 'src/Components/Badge/Badge';
import { createRoute } from 'src/utils/routing';
+import { openModal } from "src/redux/features/modals.slice";
type MakerType = GetMakersInTournamentQuery['getMakersInTournament']['makers'][number]
@@ -15,7 +16,12 @@ interface Props {
export default function MakerCard({ maker, isMe }: Props) {
- const dispatch = useAppDispatch()
+ const dispatch = useAppDispatch();
+
+ let actionBtn =
+
+ if (isMe) actionBtn = ;
+ else actionBtn =
return (
@@ -36,7 +42,7 @@ export default function MakerCard({ maker, isMe }: Props) {
No roles added
}
- {isMe && }
+ {actionBtn}
@@ -60,6 +66,7 @@ export default function MakerCard({ maker, isMe }: Props) {
No skills added
}
- {isMe && }
+ {actionBtn}
+
)
}
diff --git a/src/features/Tournaments/pages/MakersPage/tournamentMakers.graphql b/src/features/Tournaments/pages/MakersPage/tournamentMakers.graphql
index 0a8856c..f1ebe98 100644
--- a/src/features/Tournaments/pages/MakersPage/tournamentMakers.graphql
+++ b/src/features/Tournaments/pages/MakersPage/tournamentMakers.graphql
@@ -37,6 +37,10 @@ query GetMakersInTournament(
name
avatar
jobTitle
+ email
+ twitter
+ linkedin
+ github
roles {
id
icon
diff --git a/src/graphql/index.tsx b/src/graphql/index.tsx
index c5dc674..4ae1dba 100644
--- a/src/graphql/index.tsx
+++ b/src/graphql/index.tsx
@@ -844,7 +844,7 @@ export type GetMakersInTournamentQueryVariables = Exact<{
}>;
-export type GetMakersInTournamentQuery = { __typename?: 'Query', getMakersInTournament: { __typename?: 'TournamentMakersResponse', hasNext: boolean | null, hasPrev: boolean | null, makers: Array<{ __typename?: 'User', id: number, name: string, avatar: string, jobTitle: string | null, roles: Array<{ __typename?: 'MakerRole', id: number, icon: string, title: string }>, skills: Array<{ __typename?: 'MakerSkill', id: number, title: string }> }> } };
+export type GetMakersInTournamentQuery = { __typename?: 'Query', getMakersInTournament: { __typename?: 'TournamentMakersResponse', hasNext: boolean | null, hasPrev: boolean | null, makers: Array<{ __typename?: 'User', id: number, name: string, avatar: string, jobTitle: string | null, email: string | null, twitter: string | null, linkedin: string | null, github: string | null, roles: Array<{ __typename?: 'MakerRole', id: number, icon: string, title: string }>, skills: Array<{ __typename?: 'MakerSkill', id: number, title: string }> }> } };
export type GetProjectsInTournamentQueryVariables = Exact<{
tournamentId: Scalars['Int'];
@@ -2277,6 +2277,10 @@ export const GetMakersInTournamentDocument = gql`
name
avatar
jobTitle
+ email
+ twitter
+ linkedin
+ github
roles {
id
icon
diff --git a/src/redux/features/modals.slice.ts b/src/redux/features/modals.slice.ts
index 42193ae..98b413f 100644
--- a/src/redux/features/modals.slice.ts
+++ b/src/redux/features/modals.slice.ts
@@ -14,6 +14,9 @@ import { EventModal } from "src/features/Tournaments/pages/EventsPage/EventModal
import { ComponentProps } from "react";
import { generateId } from "src/utils/helperFunctions";
import { NoWeblnModal } from "src/Components/Modals/NoWeblnModal";
+import { ConnectToMakerModal } from "src/features/Tournaments/pages/MakersPage/ConnectToMakerModal";
+
+
export enum Direction {
START,
@@ -39,7 +42,8 @@ export const ALL_MODALS = {
Claim_FundWithdrawCard,
// Tournaments
- EventModal: EventModal,
+ EventModal,
+ ConnectToMakerModal,
// Misc
ConfirmModal,