From 704bd38ccea415b2679ebb510ef3415309c3dcdf Mon Sep 17 00:00:00 2001 From: Hammad Jutt Date: Sun, 20 Dec 2020 16:59:29 -0700 Subject: [PATCH] Implement list of Guilds in frontend --- packages/codegen/schema.graphql | 889 +++++++++++++++++- packages/design-system/src/MetaButton.tsx | 7 +- packages/design-system/src/theme.ts | 4 + packages/web/components/Guild/GuildHero.tsx | 42 + packages/web/components/Guild/GuildLinks.tsx | 67 ++ packages/web/components/Guild/GuildTile.tsx | 78 ++ packages/web/components/GuildList.tsx | 16 + packages/web/components/PageHeader.tsx | 2 +- .../web/components/Player/PlayerFeature.tsx | 29 - .../web/components/Player/PlayerFeatures.tsx | 58 -- .../Player/Section/PlayerAchievements.tsx | 6 +- .../Player/Section/PlayerCollab.tsx | 2 +- .../Player/Section/PlayerGallery.tsx | 6 +- .../components/Player/Section/PlayerHero.tsx | 17 +- .../Player/Section/PlayerMemberships.tsx | 6 +- .../Player/Section/PlayerSkills.tsx | 6 +- .../PlayerSection.tsx => ProfileSection.tsx} | 4 +- packages/web/graphql/fragments.ts | 15 + packages/web/graphql/getGuild.ts | 23 + packages/web/graphql/getGuilds.ts | 30 + packages/web/pages/guild/[guildname].tsx | 88 ++ packages/web/pages/guilds.tsx | 25 + packages/web/pages/player/[username].tsx | 1 - 23 files changed, 1293 insertions(+), 128 deletions(-) create mode 100644 packages/web/components/Guild/GuildHero.tsx create mode 100644 packages/web/components/Guild/GuildLinks.tsx create mode 100644 packages/web/components/Guild/GuildTile.tsx create mode 100644 packages/web/components/GuildList.tsx delete mode 100644 packages/web/components/Player/PlayerFeature.tsx delete mode 100644 packages/web/components/Player/PlayerFeatures.tsx rename packages/web/components/{Player/Section/PlayerSection.tsx => ProfileSection.tsx} (92%) create mode 100644 packages/web/graphql/getGuild.ts create mode 100644 packages/web/graphql/getGuilds.ts create mode 100644 packages/web/pages/guild/[guildname].tsx create mode 100644 packages/web/pages/guilds.tsx diff --git a/packages/codegen/schema.graphql b/packages/codegen/schema.graphql index c685731d..2540849f 100644 --- a/packages/codegen/schema.graphql +++ b/packages/codegen/schema.graphql @@ -591,11 +591,288 @@ columns and relationships of "Guild" type Guild { """An object relationship""" GuildType: GuildType! + description: String + discord_invite_url: String + + """An array relationship""" + guild_accounts( + """distinct select on columns""" + distinct_on: [guild_account_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_account_order_by!] + + """filter the rows returned""" + where: guild_account_bool_exp + ): [guild_account!]! + + """An aggregated array relationship""" + guild_accounts_aggregate( + """distinct select on columns""" + distinct_on: [guild_account_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_account_order_by!] + + """filter the rows returned""" + where: guild_account_bool_exp + ): guild_account_aggregate! + + """An array relationship""" + guild_players( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): [guild_player!]! + + """An aggregated array relationship""" + guild_players_aggregate( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): guild_player_aggregate! + + """Unique friendly identifier for the Guild (used in URL)""" + guildname: String! id: uuid! - identifier: String! + join_button_url: String logo: String + moloch_address: String name: String! + + """The area of focus for the guild (e.g. funding, project, etc)""" type: GuildType_enum! + website_url: String +} + +""" +columns and relationships of "guild_account" +""" +type guild_account { + """An object relationship""" + AccountType: AccountType! + + """An object relationship""" + Guild: Guild! + guild_id: uuid! + identifier: String! + type: AccountType_enum! +} + +""" +aggregated selection of "guild_account" +""" +type guild_account_aggregate { + aggregate: guild_account_aggregate_fields + nodes: [guild_account!]! +} + +""" +aggregate fields of "guild_account" +""" +type guild_account_aggregate_fields { + count(columns: [guild_account_select_column!], distinct: Boolean): Int + max: guild_account_max_fields + min: guild_account_min_fields +} + +""" +order by aggregate values of table "guild_account" +""" +input guild_account_aggregate_order_by { + count: order_by + max: guild_account_max_order_by + min: guild_account_min_order_by +} + +""" +input type for inserting array relation for remote table "guild_account" +""" +input guild_account_arr_rel_insert_input { + data: [guild_account_insert_input!]! + on_conflict: guild_account_on_conflict +} + +""" +Boolean expression to filter rows from the table "guild_account". All fields are combined with a logical 'AND'. +""" +input guild_account_bool_exp { + AccountType: AccountType_bool_exp + Guild: Guild_bool_exp + _and: [guild_account_bool_exp] + _not: guild_account_bool_exp + _or: [guild_account_bool_exp] + guild_id: uuid_comparison_exp + identifier: String_comparison_exp + type: AccountType_enum_comparison_exp +} + +""" +unique or primary key constraints on table "guild_account" +""" +enum guild_account_constraint { + """unique or primary key constraint""" + guild_account_pkey + + """unique or primary key constraint""" + guild_account_type_identifier_key +} + +""" +input type for inserting data into table "guild_account" +""" +input guild_account_insert_input { + AccountType: AccountType_obj_rel_insert_input + Guild: Guild_obj_rel_insert_input + guild_id: uuid + identifier: String + type: AccountType_enum +} + +"""aggregate max on columns""" +type guild_account_max_fields { + guild_id: uuid + identifier: String +} + +""" +order by max() on columns of table "guild_account" +""" +input guild_account_max_order_by { + guild_id: order_by + identifier: order_by +} + +"""aggregate min on columns""" +type guild_account_min_fields { + guild_id: uuid + identifier: String +} + +""" +order by min() on columns of table "guild_account" +""" +input guild_account_min_order_by { + guild_id: order_by + identifier: order_by +} + +""" +response of any mutation on the table "guild_account" +""" +type guild_account_mutation_response { + """number of affected rows by the mutation""" + affected_rows: Int! + + """data of the affected rows by the mutation""" + returning: [guild_account!]! +} + +""" +input type for inserting object relation for remote table "guild_account" +""" +input guild_account_obj_rel_insert_input { + data: guild_account_insert_input! + on_conflict: guild_account_on_conflict +} + +""" +on conflict condition type for table "guild_account" +""" +input guild_account_on_conflict { + constraint: guild_account_constraint! + update_columns: [guild_account_update_column!]! + where: guild_account_bool_exp +} + +""" +ordering options when selecting data from "guild_account" +""" +input guild_account_order_by { + AccountType: AccountType_order_by + Guild: Guild_order_by + guild_id: order_by + identifier: order_by + type: order_by +} + +""" +primary key columns input for table: "guild_account" +""" +input guild_account_pk_columns_input { + guild_id: uuid! + type: AccountType_enum! +} + +""" +select columns of table "guild_account" +""" +enum guild_account_select_column { + """column name""" + guild_id + + """column name""" + identifier + + """column name""" + type +} + +""" +input type for updating data in table "guild_account" +""" +input guild_account_set_input { + guild_id: uuid + identifier: String + type: AccountType_enum +} + +""" +update columns of table "guild_account" +""" +enum guild_account_update_column { + """column name""" + guild_id + + """column name""" + identifier + + """column name""" + type } """ @@ -640,17 +917,27 @@ input Guild_bool_exp { _and: [Guild_bool_exp] _not: Guild_bool_exp _or: [Guild_bool_exp] + description: String_comparison_exp + discord_invite_url: String_comparison_exp + guild_accounts: guild_account_bool_exp + guild_players: guild_player_bool_exp + guildname: String_comparison_exp id: uuid_comparison_exp - identifier: String_comparison_exp + join_button_url: String_comparison_exp logo: String_comparison_exp + moloch_address: String_comparison_exp name: String_comparison_exp type: GuildType_enum_comparison_exp + website_url: String_comparison_exp } """ unique or primary key constraints on table "Guild" """ enum Guild_constraint { + """unique or primary key constraint""" + Guild_guildname_key + """unique or primary key constraint""" Guild_pkey } @@ -660,47 +947,74 @@ input type for inserting data into table "Guild" """ input Guild_insert_input { GuildType: GuildType_obj_rel_insert_input + description: String + discord_invite_url: String + guild_accounts: guild_account_arr_rel_insert_input + guild_players: guild_player_arr_rel_insert_input + guildname: String id: uuid - identifier: String + join_button_url: String logo: String + moloch_address: String name: String type: GuildType_enum + website_url: String } """aggregate max on columns""" type Guild_max_fields { + description: String + discord_invite_url: String + guildname: String id: uuid - identifier: String + join_button_url: String logo: String + moloch_address: String name: String + website_url: String } """ order by max() on columns of table "Guild" """ input Guild_max_order_by { + description: order_by + discord_invite_url: order_by + guildname: order_by id: order_by - identifier: order_by + join_button_url: order_by logo: order_by + moloch_address: order_by name: order_by + website_url: order_by } """aggregate min on columns""" type Guild_min_fields { + description: String + discord_invite_url: String + guildname: String id: uuid - identifier: String + join_button_url: String logo: String + moloch_address: String name: String + website_url: String } """ order by min() on columns of table "Guild" """ input Guild_min_order_by { + description: order_by + discord_invite_url: order_by + guildname: order_by id: order_by - identifier: order_by + join_button_url: order_by logo: order_by + moloch_address: order_by name: order_by + website_url: order_by } """ @@ -736,11 +1050,18 @@ ordering options when selecting data from "Guild" """ input Guild_order_by { GuildType: GuildType_order_by + description: order_by + discord_invite_url: order_by + guild_accounts_aggregate: guild_account_aggregate_order_by + guild_players_aggregate: guild_player_aggregate_order_by + guildname: order_by id: order_by - identifier: order_by + join_button_url: order_by logo: order_by + moloch_address: order_by name: order_by type: order_by + website_url: order_by } """ @@ -750,55 +1071,272 @@ input Guild_pk_columns_input { id: uuid! } +""" +columns and relationships of "guild_player" +""" +type guild_player { + """An object relationship""" + Guild: Guild! + + """An object relationship""" + Player: Player! + guild_id: uuid! + player_id: uuid! +} + +""" +aggregated selection of "guild_player" +""" +type guild_player_aggregate { + aggregate: guild_player_aggregate_fields + nodes: [guild_player!]! +} + +""" +aggregate fields of "guild_player" +""" +type guild_player_aggregate_fields { + count(columns: [guild_player_select_column!], distinct: Boolean): Int + max: guild_player_max_fields + min: guild_player_min_fields +} + +""" +order by aggregate values of table "guild_player" +""" +input guild_player_aggregate_order_by { + count: order_by + max: guild_player_max_order_by + min: guild_player_min_order_by +} + +""" +input type for inserting array relation for remote table "guild_player" +""" +input guild_player_arr_rel_insert_input { + data: [guild_player_insert_input!]! + on_conflict: guild_player_on_conflict +} + +""" +Boolean expression to filter rows from the table "guild_player". All fields are combined with a logical 'AND'. +""" +input guild_player_bool_exp { + Guild: Guild_bool_exp + Player: Player_bool_exp + _and: [guild_player_bool_exp] + _not: guild_player_bool_exp + _or: [guild_player_bool_exp] + guild_id: uuid_comparison_exp + player_id: uuid_comparison_exp +} + +""" +unique or primary key constraints on table "guild_player" +""" +enum guild_player_constraint { + """unique or primary key constraint""" + guild_player_pkey +} + +""" +input type for inserting data into table "guild_player" +""" +input guild_player_insert_input { + Guild: Guild_obj_rel_insert_input + Player: Player_obj_rel_insert_input + guild_id: uuid + player_id: uuid +} + +"""aggregate max on columns""" +type guild_player_max_fields { + guild_id: uuid + player_id: uuid +} + +""" +order by max() on columns of table "guild_player" +""" +input guild_player_max_order_by { + guild_id: order_by + player_id: order_by +} + +"""aggregate min on columns""" +type guild_player_min_fields { + guild_id: uuid + player_id: uuid +} + +""" +order by min() on columns of table "guild_player" +""" +input guild_player_min_order_by { + guild_id: order_by + player_id: order_by +} + +""" +response of any mutation on the table "guild_player" +""" +type guild_player_mutation_response { + """number of affected rows by the mutation""" + affected_rows: Int! + + """data of the affected rows by the mutation""" + returning: [guild_player!]! +} + +""" +input type for inserting object relation for remote table "guild_player" +""" +input guild_player_obj_rel_insert_input { + data: guild_player_insert_input! + on_conflict: guild_player_on_conflict +} + +""" +on conflict condition type for table "guild_player" +""" +input guild_player_on_conflict { + constraint: guild_player_constraint! + update_columns: [guild_player_update_column!]! + where: guild_player_bool_exp +} + +""" +ordering options when selecting data from "guild_player" +""" +input guild_player_order_by { + Guild: Guild_order_by + Player: Player_order_by + guild_id: order_by + player_id: order_by +} + +""" +primary key columns input for table: "guild_player" +""" +input guild_player_pk_columns_input { + guild_id: uuid! + player_id: uuid! +} + +""" +select columns of table "guild_player" +""" +enum guild_player_select_column { + """column name""" + guild_id + + """column name""" + player_id +} + +""" +input type for updating data in table "guild_player" +""" +input guild_player_set_input { + guild_id: uuid + player_id: uuid +} + +""" +update columns of table "guild_player" +""" +enum guild_player_update_column { + """column name""" + guild_id + + """column name""" + player_id +} + """ select columns of table "Guild" """ enum Guild_select_column { + """column name""" + description + + """column name""" + discord_invite_url + + """column name""" + guildname + """column name""" id """column name""" - identifier + join_button_url """column name""" logo + """column name""" + moloch_address + """column name""" name """column name""" type + + """column name""" + website_url } """ input type for updating data in table "Guild" """ input Guild_set_input { + description: String + discord_invite_url: String + guildname: String id: uuid - identifier: String + join_button_url: String logo: String + moloch_address: String name: String type: GuildType_enum + website_url: String } """ update columns of table "Guild" """ enum Guild_update_column { + """column name""" + description + + """column name""" + discord_invite_url + + """column name""" + guildname + """column name""" id """column name""" - identifier + join_button_url """column name""" logo + """column name""" + moloch_address + """column name""" name """column name""" type + + """column name""" + website_url } """ @@ -897,9 +1435,11 @@ enum GuildType_constraint { } enum GuildType_enum { - ARAGON - EVEREST - MOLOCH + FUNDING + PROJECT + RESEARCH + SERVICE + SOCIAL } """ @@ -1356,6 +1896,32 @@ type mutation_root { """ delete_Skill_by_pk(id: uuid!): Skill + """ + delete data from the table: "guild_account" + """ + delete_guild_account( + """filter the rows which have to be deleted""" + where: guild_account_bool_exp! + ): guild_account_mutation_response + + """ + delete single row from the table: "guild_account" + """ + delete_guild_account_by_pk(guild_id: uuid!, type: AccountType_enum!): guild_account + + """ + delete data from the table: "guild_player" + """ + delete_guild_player( + """filter the rows which have to be deleted""" + where: guild_player_bool_exp! + ): guild_player_mutation_response + + """ + delete single row from the table: "guild_player" + """ + delete_guild_player_by_pk(guild_id: uuid!, player_id: uuid!): guild_player + """ delete data from the table: "me" """ @@ -1606,6 +2172,50 @@ type mutation_root { on_conflict: Skill_on_conflict ): Skill + """ + insert data into the table: "guild_account" + """ + insert_guild_account( + """the rows to be inserted""" + objects: [guild_account_insert_input!]! + + """on conflict condition""" + on_conflict: guild_account_on_conflict + ): guild_account_mutation_response + + """ + insert a single row into the table: "guild_account" + """ + insert_guild_account_one( + """the row to be inserted""" + object: guild_account_insert_input! + + """on conflict condition""" + on_conflict: guild_account_on_conflict + ): guild_account + + """ + insert data into the table: "guild_player" + """ + insert_guild_player( + """the rows to be inserted""" + objects: [guild_player_insert_input!]! + + """on conflict condition""" + on_conflict: guild_player_on_conflict + ): guild_player_mutation_response + + """ + insert a single row into the table: "guild_player" + """ + insert_guild_player_one( + """the row to be inserted""" + object: guild_player_insert_input! + + """on conflict condition""" + on_conflict: guild_player_on_conflict + ): guild_player + """ insert data into the table: "me" """ @@ -1850,6 +2460,46 @@ type mutation_root { pk_columns: Skill_pk_columns_input! ): Skill + """ + update data of the table: "guild_account" + """ + update_guild_account( + """sets the columns of the filtered rows to the given values""" + _set: guild_account_set_input + + """filter the rows which have to be updated""" + where: guild_account_bool_exp! + ): guild_account_mutation_response + + """ + update single row of the table: "guild_account" + """ + update_guild_account_by_pk( + """sets the columns of the filtered rows to the given values""" + _set: guild_account_set_input + pk_columns: guild_account_pk_columns_input! + ): guild_account + + """ + update data of the table: "guild_player" + """ + update_guild_player( + """sets the columns of the filtered rows to the given values""" + _set: guild_player_set_input + + """filter the rows which have to be updated""" + where: guild_player_bool_exp! + ): guild_player_mutation_response + + """ + update single row of the table: "guild_player" + """ + update_guild_player_by_pk( + """sets the columns of the filtered rows to the given values""" + _set: guild_player_set_input + pk_columns: guild_player_pk_columns_input! + ): guild_player + """ update data of the table: "me" """ @@ -1988,6 +2638,42 @@ type Player { daohausMemberships: [Member!]! enneagram: EnneagramType_enum ethereum_address: String + + """An array relationship""" + guilds( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): [guild_player!]! + + """An aggregated array relationship""" + guilds_aggregate( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): guild_player_aggregate! id: uuid! """An object relationship""" @@ -2085,6 +2771,7 @@ input Player_bool_exp { created_at: timestamptz_comparison_exp enneagram: EnneagramType_enum_comparison_exp ethereum_address: String_comparison_exp + guilds: guild_player_bool_exp id: uuid_comparison_exp playerType: PlayerType_bool_exp playerTypeId: Int_comparison_exp @@ -2136,6 +2823,7 @@ input Player_insert_input { created_at: timestamptz enneagram: EnneagramType_enum ethereum_address: String + guilds: guild_player_arr_rel_insert_input id: uuid playerType: PlayerType_obj_rel_insert_input playerTypeId: Int @@ -2256,6 +2944,7 @@ input Player_order_by { created_at: order_by enneagram: order_by ethereum_address: order_by + guilds_aggregate: guild_player_aggregate_order_by id: order_by playerType: PlayerType_order_by playerTypeId: order_by @@ -3667,6 +4356,92 @@ type query_root { getBoxProfile(address: String): BoxProfile getDaoHausMemberships(memberAddress: String): [Member!]! + """ + fetch data from the table: "guild_account" + """ + guild_account( + """distinct select on columns""" + distinct_on: [guild_account_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_account_order_by!] + + """filter the rows returned""" + where: guild_account_bool_exp + ): [guild_account!]! + + """ + fetch aggregated fields from the table: "guild_account" + """ + guild_account_aggregate( + """distinct select on columns""" + distinct_on: [guild_account_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_account_order_by!] + + """filter the rows returned""" + where: guild_account_bool_exp + ): guild_account_aggregate! + + """fetch data from the table: "guild_account" using primary key columns""" + guild_account_by_pk(guild_id: uuid!, type: AccountType_enum!): guild_account + + """ + fetch data from the table: "guild_player" + """ + guild_player( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): [guild_player!]! + + """ + fetch aggregated fields from the table: "guild_player" + """ + guild_player_aggregate( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): guild_player_aggregate! + + """fetch data from the table: "guild_player" using primary key columns""" + guild_player_by_pk(guild_id: uuid!, player_id: uuid!): guild_player + """ fetch data from the table: "me" """ @@ -4595,6 +5370,92 @@ type subscription_root { """fetch data from the table: "Skill" using primary key columns""" Skill_by_pk(id: uuid!): Skill + """ + fetch data from the table: "guild_account" + """ + guild_account( + """distinct select on columns""" + distinct_on: [guild_account_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_account_order_by!] + + """filter the rows returned""" + where: guild_account_bool_exp + ): [guild_account!]! + + """ + fetch aggregated fields from the table: "guild_account" + """ + guild_account_aggregate( + """distinct select on columns""" + distinct_on: [guild_account_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_account_order_by!] + + """filter the rows returned""" + where: guild_account_bool_exp + ): guild_account_aggregate! + + """fetch data from the table: "guild_account" using primary key columns""" + guild_account_by_pk(guild_id: uuid!, type: AccountType_enum!): guild_account + + """ + fetch data from the table: "guild_player" + """ + guild_player( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): [guild_player!]! + + """ + fetch aggregated fields from the table: "guild_player" + """ + guild_player_aggregate( + """distinct select on columns""" + distinct_on: [guild_player_select_column!] + + """limit the number of rows returned""" + limit: Int + + """skip the first n rows. Use only with order_by""" + offset: Int + + """sort the rows by one or more columns""" + order_by: [guild_player_order_by!] + + """filter the rows returned""" + where: guild_player_bool_exp + ): guild_player_aggregate! + + """fetch data from the table: "guild_player" using primary key columns""" + guild_player_by_pk(guild_id: uuid!, player_id: uuid!): guild_player + """ fetch data from the table: "me" """ diff --git a/packages/design-system/src/MetaButton.tsx b/packages/design-system/src/MetaButton.tsx index 045999f3..0ce28ba6 100644 --- a/packages/design-system/src/MetaButton.tsx +++ b/packages/design-system/src/MetaButton.tsx @@ -1,7 +1,12 @@ import { Button, ButtonProps } from '@chakra-ui/core'; import React from 'react'; -export const MetaButton: React.FC = ({ children, ...props }) => ( +type LinkProps = { href: string; target: '_blank' }; + +export const MetaButton: React.FC = ({ + children, + ...props +}) => ( + ) : null} + {guild.discord_invite_url ? ( + + ) : null} + {/* + {guild.Accounts.map((acc) => { + if (acc.type === 'TWITTER') { + const link = `https://twitter.com/${acc.identifier}`; + return ( + + ); + } + if (acc.type === 'GITHUB') { + const link = `https://github.com/${acc.identifier}`; + return ( + + ); + } + return null; + })} */} + + ); +}; diff --git a/packages/web/components/Guild/GuildTile.tsx b/packages/web/components/Guild/GuildTile.tsx new file mode 100644 index 00000000..b06792f4 --- /dev/null +++ b/packages/web/components/Guild/GuildTile.tsx @@ -0,0 +1,78 @@ +import { + Avatar, + Flex, + Heading, + HStack, + MetaButton, + MetaTag, + Text, + VStack, + Wrap, +} from '@metafam/ds'; +import { GuildLinks } from 'components/Guild/GuildLinks'; +import { GuildFragmentFragment } from 'graphql/autogen/types'; +import React from 'react'; + +type Props = { + guild: GuildFragmentFragment; +}; + +export const GuildTile: React.FC = ({ guild }) => ( + + + + {guild.logo ? ( + + ) : null} + + + {guild.name} + + + + {guild.type ? {guild.type} GUILD : null} + + {guild.description ? ( + + + ABOUT + + {guild.description} + + ) : null} + + + + + LINKS + + + + + + {guild.join_button_url ? ( + + Join + + ) : null} + + +); diff --git a/packages/web/components/GuildList.tsx b/packages/web/components/GuildList.tsx new file mode 100644 index 00000000..7acb24f7 --- /dev/null +++ b/packages/web/components/GuildList.tsx @@ -0,0 +1,16 @@ +import { SimpleGrid } from '@metafam/ds'; +import { GuildTile } from 'components/Guild/GuildTile'; +import { GuildFragmentFragment } from 'graphql/autogen/types'; +import React from 'react'; + +type Props = { + guilds: GuildFragmentFragment[]; +}; + +export const GuildList: React.FC = ({ guilds }) => ( + + {guilds.map((p) => ( + + ))} + +); diff --git a/packages/web/components/PageHeader.tsx b/packages/web/components/PageHeader.tsx index 136fd467..45006bd0 100644 --- a/packages/web/components/PageHeader.tsx +++ b/packages/web/components/PageHeader.tsx @@ -76,7 +76,7 @@ export const PageHeader: React.FC = () => { direction={{ base: 'column', md: 'row' }} spacing={{ base: 4, md: 6, lg: 10 }} > - Players + Guilds Discord diff --git a/packages/web/components/Player/PlayerFeature.tsx b/packages/web/components/Player/PlayerFeature.tsx deleted file mode 100644 index cc082a9a..00000000 --- a/packages/web/components/Player/PlayerFeature.tsx +++ /dev/null @@ -1,29 +0,0 @@ -import { Box, Text } from '@metafam/ds'; -import React from 'react'; - -type Props = { - title: string; - value?: string | null | undefined; -} & React.ComponentProps; - -export const PlayerFeature: React.FC = ({ - title, - value, - children, - ...props -}) => ( - - - {title} - - - {value || children} - - -); diff --git a/packages/web/components/Player/PlayerFeatures.tsx b/packages/web/components/Player/PlayerFeatures.tsx deleted file mode 100644 index 67dc17c6..00000000 --- a/packages/web/components/Player/PlayerFeatures.tsx +++ /dev/null @@ -1,58 +0,0 @@ -import { Container, Divider, MetaTag, Wrap } from '@metafam/ds'; -import { PlayerFeature } from 'components/Player/PlayerFeature'; -import { PlayerFragmentFragment } from 'graphql/autogen/types'; -import React from 'react'; - -type Props = { player: PlayerFragmentFragment }; - -export const PlayerFeatures: React.FC = ({ player }) => { - return ( - - - - {player.rank && ( - - )} - {player.rank && ( - - - {player.rank} - - - )} - {player.box_profile?.location && ( - - )} - {player.box_profile?.location && ( - - )} - - {/* */} - {/* */} - - - - ); -}; diff --git a/packages/web/components/Player/Section/PlayerAchievements.tsx b/packages/web/components/Player/Section/PlayerAchievements.tsx index 3cb9cb69..9647dd95 100644 --- a/packages/web/components/Player/Section/PlayerAchievements.tsx +++ b/packages/web/components/Player/Section/PlayerAchievements.tsx @@ -2,7 +2,7 @@ import { HStack, Text } from '@metafam/ds'; import React from 'react'; import { FaMedal } from 'react-icons/fa'; -import { PlayerSection } from './PlayerSection'; +import { ProfileSection } from '../../ProfileSection'; // TODO Fake data type Props = { onRemoveClick: () => void }; @@ -15,7 +15,7 @@ export const PlayerAchievements: React.FC = ({ onRemoveClick }) => { ]; return ( - + {(fakeData || []).slice(0, show ? 999 : 3).map((title) => ( @@ -34,6 +34,6 @@ export const PlayerAchievements: React.FC = ({ onRemoveClick }) => { View {show ? 'less' : 'all'} )} - + ); }; diff --git a/packages/web/components/Player/Section/PlayerCollab.tsx b/packages/web/components/Player/Section/PlayerCollab.tsx index af531345..ea3ace8f 100644 --- a/packages/web/components/Player/Section/PlayerCollab.tsx +++ b/packages/web/components/Player/Section/PlayerCollab.tsx @@ -9,7 +9,7 @@ export const PlayerCollab: React.FC = ({ player }) => { + } > diff --git a/packages/web/components/Player/Section/PlayerGallery.tsx b/packages/web/components/Player/Section/PlayerGallery.tsx index e32d371a..d288f864 100644 --- a/packages/web/components/Player/Section/PlayerGallery.tsx +++ b/packages/web/components/Player/Section/PlayerGallery.tsx @@ -19,7 +19,7 @@ import { import React from 'react'; import { FaTimes } from 'react-icons/fa'; -import { PlayerSection } from './PlayerSection'; +import { ProfileSection } from '../../ProfileSection'; type Props = { player: PlayerFragmentFragment; onRemoveClick: () => void }; @@ -67,7 +67,7 @@ export const PlayerGallery: React.FC = ({ player, onRemoveClick }) => { const { isOpen, onOpen, onClose } = useDisclosure(); const { favorites, data, loading } = useOpenSeaCollectibles({ player }); return ( - + {!loading && favorites?.map((nft) => )} {!loading && data?.length > 3 && ( @@ -133,6 +133,6 @@ export const PlayerGallery: React.FC = ({ player, onRemoveClick }) => { - + ); }; diff --git a/packages/web/components/Player/Section/PlayerHero.tsx b/packages/web/components/Player/Section/PlayerHero.tsx index 05a4d7e2..020f1781 100644 --- a/packages/web/components/Player/Section/PlayerHero.tsx +++ b/packages/web/components/Player/Section/PlayerHero.tsx @@ -9,20 +9,20 @@ import { import { PersonalityTypes } from '../../../graphql/types'; import { FlexContainer } from '../../Container'; +import { ProfileSection } from '../../ProfileSection'; import { PlayerContacts } from '../PlayerContacts'; import { PlayerCollab } from './PlayerCollab'; -import { PlayerSection } from './PlayerSection'; const BIO_LENGTH = 240; type Props = { player: PlayerFragmentFragment }; export const PlayerHero: React.FC = ({ player }) => { const [show, setShow] = React.useState( - getPlayerDescription(player).length < 115, + getPlayerDescription(player).length < BIO_LENGTH, ); return ( - + = ({ player }) => { {getPlayerName(player)} - - - - - {`${getPlayerDescription(player).substring( @@ -60,6 +55,10 @@ export const PlayerHero: React.FC = ({ player }) => { )} + + + + @@ -89,6 +88,6 @@ export const PlayerHero: React.FC = ({ player }) => { ) : null} - + ); }; diff --git a/packages/web/components/Player/Section/PlayerMemberships.tsx b/packages/web/components/Player/Section/PlayerMemberships.tsx index d6cdfee7..83dc311f 100644 --- a/packages/web/components/Player/Section/PlayerMemberships.tsx +++ b/packages/web/components/Player/Section/PlayerMemberships.tsx @@ -8,7 +8,7 @@ import metacartelImage from '../../../assets/moloch/metacartel.png'; import metaclanImage from '../../../assets/moloch/metaclan.png'; import metagameImage from '../../../assets/moloch/metagame.png'; import raidGuildImage from '../../../assets/moloch/raid_guild.png'; -import { PlayerSection } from './PlayerSection'; +import { ProfileSection } from '../../ProfileSection'; type Props = { player: PlayerFragmentFragment; onRemoveClick: () => void }; export const PlayerMemberships: React.FC = ({ @@ -27,7 +27,7 @@ export const PlayerMemberships: React.FC = ({ }; return ( - + = ({ View {show ? 'less' : 'all'} )} - + ); }; diff --git a/packages/web/components/Player/Section/PlayerSkills.tsx b/packages/web/components/Player/Section/PlayerSkills.tsx index 4567c71e..cdfa5dc9 100644 --- a/packages/web/components/Player/Section/PlayerSkills.tsx +++ b/packages/web/components/Player/Section/PlayerSkills.tsx @@ -3,7 +3,7 @@ import { PlayerFragmentFragment } from 'graphql/autogen/types'; import { SkillColors } from 'graphql/types'; import React from 'react'; -import { PlayerSection } from './PlayerSection'; +import { ProfileSection } from '../../ProfileSection'; type Props = { player: PlayerFragmentFragment; onRemoveClick: () => void }; export const PlayerSkills: React.FC = ({ player, onRemoveClick }) => { @@ -11,7 +11,7 @@ export const PlayerSkills: React.FC = ({ player, onRemoveClick }) => { return null; } return ( - + {(player.Player_Skills || []).map(({ Skill }) => ( = ({ player, onRemoveClick }) => { ))} - + ); }; diff --git a/packages/web/components/Player/Section/PlayerSection.tsx b/packages/web/components/ProfileSection.tsx similarity index 92% rename from packages/web/components/Player/Section/PlayerSection.tsx rename to packages/web/components/ProfileSection.tsx index af42fc2a..3489cd31 100644 --- a/packages/web/components/Player/Section/PlayerSection.tsx +++ b/packages/web/components/ProfileSection.tsx @@ -2,7 +2,7 @@ import { Box, HStack, Text } from '@metafam/ds'; import React from 'react'; import { FaTimes } from 'react-icons/fa'; -export type PlayerSectionProps = { +export type ProfileSectionProps = { title?: string; children?: React.ReactNode; onRemoveClick?: () => void; @@ -10,7 +10,7 @@ export type PlayerSectionProps = { }; // TODO If MetaBox is only used for Player profile maybe merge both component -export const PlayerSection: React.FC = ({ +export const ProfileSection: React.FC = ({ children, title, onRemoveClick, diff --git a/packages/web/graphql/fragments.ts b/packages/web/graphql/fragments.ts index 86ce3dc6..3ac80169 100644 --- a/packages/web/graphql/fragments.ts +++ b/packages/web/graphql/fragments.ts @@ -53,3 +53,18 @@ export const PlayerFragment = gql` } } `; + +export const GuildFragment = gql` + fragment GuildFragment on Guild { + id + guildname + description + discord_invite_url + join_button_url + logo + moloch_address + name + type + website_url + } +`; diff --git a/packages/web/graphql/getGuild.ts b/packages/web/graphql/getGuild.ts new file mode 100644 index 00000000..9c1b3fb9 --- /dev/null +++ b/packages/web/graphql/getGuild.ts @@ -0,0 +1,23 @@ +import gql from 'fake-tag'; + +import { GetGuildQuery, GetGuildQueryVariables } from './autogen/types'; +import { client } from './client'; +import { GuildFragment } from './fragments'; + +const guildQuery = gql` + query GetGuild($guildname: String!) { + Guild(where: { guildname: { _eq: $guildname } }) { + ...GuildFragment + } + } + ${GuildFragment} +`; + +export const getGuild = async (guildname: string | undefined) => { + if (!guildname) return null; + const { data } = await client + .query(guildQuery, { guildname }) + .toPromise(); + + return data?.Guild[0]; +}; diff --git a/packages/web/graphql/getGuilds.ts b/packages/web/graphql/getGuilds.ts new file mode 100644 index 00000000..ede14516 --- /dev/null +++ b/packages/web/graphql/getGuilds.ts @@ -0,0 +1,30 @@ +import gql from 'fake-tag'; + +import { GetGuildsQuery, GetGuildsQueryVariables } from './autogen/types'; +import { client } from './client'; +import { GuildFragment } from './fragments'; + +const guildsQuery = gql` + query GetGuilds($limit: Int) { + Guild(limit: $limit) { + ...GuildFragment + } + } + ${GuildFragment} +`; + +export const getGuilds = async (limit = 50) => { + const { data, error } = await client + .query(guildsQuery, { limit }) + .toPromise(); + + if (!data) { + if (error) { + throw error; + } + + return []; + } + + return data.Guild; +}; diff --git a/packages/web/pages/guild/[guildname].tsx b/packages/web/pages/guild/[guildname].tsx new file mode 100644 index 00000000..074d09e8 --- /dev/null +++ b/packages/web/pages/guild/[guildname].tsx @@ -0,0 +1,88 @@ +import { Box, Flex, LoadingState, Stack } from '@metafam/ds'; +import { getGuild } from 'graphql/getGuild'; +import { getGuilds } from 'graphql/getGuilds'; +import { + GetStaticPaths, + GetStaticPropsContext, + InferGetStaticPropsType, +} from 'next'; +import Error from 'next/error'; +import { useRouter } from 'next/router'; +import React from 'react'; + +import { PageContainer } from '../../components/Container'; +import { GuildHero } from '../../components/Guild/GuildHero'; +import { ProfileSection } from '../../components/ProfileSection'; + +type Props = InferGetStaticPropsType; + +const GuildPage: React.FC = ({ guild }) => { + const router = useRouter(); + + if (router.isFallback) { + return ; + } + + if (!guild) { + return ; + } + + return ( + + + + + + + + + + + + + + + + + + ); +}; + +export default GuildPage; + +type QueryParams = { guildname: string }; + +export const getStaticPaths: GetStaticPaths = async () => { + const guilds = await getGuilds(); + + return { + paths: guilds.map(({ guildname }) => ({ + params: { guildname }, + })), + fallback: true, + }; +}; + +export const getStaticProps = async ( + context: GetStaticPropsContext, +) => { + const guildname = context.params?.guildname; + const guild = await getGuild(guildname); + + return { + props: { + guild, + }, + revalidate: 1, + }; +}; diff --git a/packages/web/pages/guilds.tsx b/packages/web/pages/guilds.tsx new file mode 100644 index 00000000..bbe603ca --- /dev/null +++ b/packages/web/pages/guilds.tsx @@ -0,0 +1,25 @@ +import { PageContainer } from 'components/Container'; +import { GuildList } from 'components/GuildList'; +import { getGuilds } from 'graphql/getGuilds'; +import { InferGetStaticPropsType } from 'next'; +import React from 'react'; + +type Props = InferGetStaticPropsType; + +export const getStaticProps = async () => { + const guilds = await getGuilds(); + return { + props: { + guilds, + }, + revalidate: 10, + }; +}; + +const GuildsPage: React.FC = ({ guilds }) => ( + + + +); + +export default GuildsPage; diff --git a/packages/web/pages/player/[username].tsx b/packages/web/pages/player/[username].tsx index e5c91497..45a4382a 100644 --- a/packages/web/pages/player/[username].tsx +++ b/packages/web/pages/player/[username].tsx @@ -95,7 +95,6 @@ const PlayerPage: React.FC = ({ player }) => { }; return ( - // TODO Should be a custom background and maybe on app level(with the header)