Fix group game and settings visibility

rivet-gg · Oct 18, 2023 · 06d204d · 06d204d
1 parent 6225c98
commit 06d204d
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 11 deletions.
diff --git a/src/elements/pages/dev/group/group-banner.ts b/src/elements/pages/dev/group/group-banner.ts
@@ -4,6 +4,7 @@ import * as group from '@rivet-gg/group';
 import { cssify } from '../../../../utils/css';
 import assets from '../../../../data/assets';
 import routes from '../../../../routes';
+import { when } from 'lit/directives/when.js';
 
 @customElement('group-banner')
 export default class DevGroupBanner extends LitElement {
@@ -28,14 +29,20 @@ export default class DevGroupBanner extends LitElement {
 				<div class="flex flex-col place-content-center m-auto h-full w-1/2 text-center">
 					${this.group
 						? html`
-								<stylized-button
-									class="absolute top-6 right-10"
-									color="gray"
-									.icon=${'solid/gear'}
-									.href=${routes.groupSettings.build({ groupId: this.group.groupId })}
-								>
-									Settings
-								</stylized-button>
+								${
+									when(this.group.isCurrentIdentityMember, () => {
+										html`
+											<stylized-button
+												class="absolute top-6 right-10"
+												color="gray"
+												.icon=${'solid/gear'}
+												.href=${routes.groupSettings.build({ groupId: this.group.groupId })}
+											>
+												Settings
+											</stylized-button>
+										`
+									})
+								}
 								${this.renderGroupIcon(this.group)}
 								<h1 class="text-2xl mt-8">${this.group.displayName}</h1>
 						  `

diff --git a/src/elements/pages/dev/group/group.ts b/src/elements/pages/dev/group/group.ts
@@ -294,9 +294,9 @@ export default class GroupPage extends LitElement {
 				<group-banner .group=${this.profile}></group-banner>
 				<div class="flex flex-row w-full space-x-8 max-md:px-4 ">
 					${when(
-						this.games,
+						this.games && this.profile.isCurrentIdentityMember,
 						() =>
-							html`<div class="games-list grid grid-cols-4 gap-4">
+							html`<div class="games-list grid grid-cols-4 gap-4 w-full">
 								<div
 									id="create-game"
 									class="dashed-border-button"
@@ -319,7 +319,12 @@ export default class GroupPage extends LitElement {
 										></dev-game-tile>`
 								)}
 							</div>`,
-						() => html``
+						() => html`
+							<div class="flex flex-col space-y-6 mx-auto">
+								<h4 class="text-xl w-full text-center">You do not have access to view this group's games.</h4>
+								<p class="text-md text-center">Try getting invited, or make sure that you are logged in.</p>
+							</div>
+							`
 					)}
 				</div>
 			</div>