diff --git a/images/elements/no-group-image.svg b/images/elements/no-group-image.svg
index c79bfd50..553f7c33 100644
--- a/images/elements/no-group-image.svg
+++ b/images/elements/no-group-image.svg
@@ -1 +1 @@
-<svg width="2048" height="1792" viewBox="0 0 2048 1792" xmlns="http://www.w3.org/2000/svg"><path d="M657 896q-162 5-265 128h-134q-82 0-138-40.5t-56-118.5q0-353 124-353 6 0 43.5 21t97.5 42.5 119 21.5q67 0 133-23-5 37-5 66 0 139 81 256zm1071 637q0 120-73 189.5t-194 69.5h-874q-121 0-194-69.5t-73-189.5q0-53 3.5-103.5t14-109 26.5-108.5 43-97.5 62-81 85.5-53.5 111.5-20q10 0 43 21.5t73 48 107 48 135 21.5 135-21.5 107-48 73-48 43-21.5q61 0 111.5 20t85.5 53.5 62 81 43 97.5 26.5 108.5 14 109 3.5 103.5zm-1024-1277q0 106-75 181t-181 75-181-75-75-181 75-181 181-75 181 75 75 181zm704 384q0 159-112.5 271.5t-271.5 112.5-271.5-112.5-112.5-271.5 112.5-271.5 271.5-112.5 271.5 112.5 112.5 271.5zm576 225q0 78-56 118.5t-138 40.5h-134q-103-123-265-128 81-117 81-256 0-29-5-66 66 23 133 23 59 0 119-21.5t97.5-42.5 43.5-21q124 0 124 353zm-128-609q0 106-75 181t-181 75-181-75-75-181 75-181 181-75 181 75 75 181z"/></svg>
\ No newline at end of file
+<svg width="2048" height="1792" viewBox="0 0 2048 1792" xmlns="http://www.w3.org/2000/svg"><path d="M657 896q-162 5-265 128h-134q-82 0-138-40.5t-56-118.5q0-353 124-353 6 0 43.5 21t97.5 42.5 119 21.5q67 0 133-23-5 37-5 66 0 139 81 256zm1071 637q0 120-73 189.5t-194 69.5h-874q-121 0-194-69.5t-73-189.5q0-53 3.5-103.5t14-109 26.5-108.5 43-97.5 62-81 85.5-53.5 111.5-20q10 0 43 21.5t73 48 107 48 135 21.5 135-21.5 107-48 73-48 43-21.5q61 0 111.5 20t85.5 53.5 62 81 43 97.5 26.5 108.5 14 109 3.5 103.5zm-1024-1277q0 106-75 181t-181 75-181-75-75-181 75-181 181-75 181 75 75 181zm704 384q0 159-112.5 271.5t-271.5 112.5-271.5-112.5-112.5-271.5 112.5-271.5 271.5-112.5 271.5 112.5 112.5 271.5zm576 225q0 78-56 118.5t-138 40.5h-134q-103-123-265-128 81-117 81-256 0-29-5-66 66 23 133 23 59 0 119-21.5t97.5-42.5 43.5-21q124 0 124 353zm-128-609q0 106-75 181t-181 75-181-75-75-181 75-181 181-75 181 75 75 181z" fill="rgb(60, 60, 60)"/></svg>
\ No newline at end of file
diff --git a/pages/group/members.pixy b/pages/group/members.pixy
index 58601a0f..f22b602c 100644
--- a/pages/group/members.pixy
+++ b/pages/group/members.pixy
@@ -6,7 +6,12 @@ component GroupMembers(group *arn.Group, member *arn.GroupMember, user *arn.User
 		each member in group.Members
 			Avatar(member.User())
 	
-	.buttons
-		button.mountable
-			Icon("user-plus")
-			span= fmt.Sprintf(`Join "%s"`, group.Name)
\ No newline at end of file
+	.buttons(data-api="/api" + group.Link())
+		if member == nil
+			button.mountable.action(data-action="join", data-trigger="click")
+				Icon("user-plus")
+				span= fmt.Sprintf(`Join "%s"`, group.Name)
+		else
+			button.mountable.action(data-action="leave", data-trigger="click")
+				Icon("user-times")
+				span= fmt.Sprintf(`Leave "%s"`, group.Name)
\ No newline at end of file
diff --git a/scripts/Actions/Group.ts b/scripts/Actions/Group.ts
new file mode 100644
index 00000000..71dab1b9
--- /dev/null
+++ b/scripts/Actions/Group.ts
@@ -0,0 +1,31 @@
+import AnimeNotifier from "scripts/AnimeNotifier"
+
+// join
+export async function join(arn: AnimeNotifier, element: HTMLElement) {
+	arn.statusMessage.showInfo("Joined group!", 1000)
+	let apiEndpoint = arn.findAPIEndpoint(element)
+
+	try {
+		await arn.post(apiEndpoint + "/join", null)
+		arn.reloadContent()
+	} catch(err) {
+		arn.statusMessage.showError(err)
+	}
+}
+
+// leave
+export async function leave(arn: AnimeNotifier, element: HTMLElement) {
+	if(!confirm(`Are you sure you want to leave the group?`)) {
+		return
+	}
+
+	arn.statusMessage.showInfo("Left group!", 1000)
+	let apiEndpoint = arn.findAPIEndpoint(element)
+
+	try {
+		await arn.post(apiEndpoint + "/leave", null)
+		arn.reloadContent()
+	} catch(err) {
+		arn.statusMessage.showError(err)
+	}
+}
\ No newline at end of file
diff --git a/scripts/Actions/Like.ts b/scripts/Actions/Like.ts
index 9375da44..c6a7383b 100644
--- a/scripts/Actions/Like.ts
+++ b/scripts/Actions/Like.ts
@@ -3,17 +3,25 @@ import AnimeNotifier from "../AnimeNotifier"
 // like
 export async function like(arn: AnimeNotifier, element: HTMLElement) {
 	arn.statusMessage.showInfo("Liked!", 1000)
-
 	let apiEndpoint = arn.findAPIEndpoint(element)
-	await arn.post(apiEndpoint + "/like", null).catch(err => arn.statusMessage.showError(err))
-	arn.reloadContent()
+
+	try {
+		await arn.post(apiEndpoint + "/like", null)
+		arn.reloadContent()
+	} catch(err) {
+		arn.statusMessage.showError(err)
+	}
 }
 
 // unlike
 export async function unlike(arn: AnimeNotifier, element: HTMLElement) {
 	arn.statusMessage.showInfo("Disliked!", 1000)
-
 	let apiEndpoint = arn.findAPIEndpoint(element)
-	await arn.post(apiEndpoint + "/unlike", null).catch(err => arn.statusMessage.showError(err))
-	arn.reloadContent()
+
+	try {
+		await arn.post(apiEndpoint + "/unlike", null)
+		arn.reloadContent()
+	} catch(err) {
+		arn.statusMessage.showError(err)
+	}
 }
\ No newline at end of file
diff --git a/scripts/Actions/index.ts b/scripts/Actions/index.ts
index 6dd6d70a..f3e221f5 100644
--- a/scripts/Actions/index.ts
+++ b/scripts/Actions/index.ts
@@ -6,6 +6,7 @@ export * from "./Editor"
 export * from "./Explore"
 export * from "./User"
 export * from "./Forum"
+export * from "./Group"
 export * from "./InfiniteScroller"
 export * from "./Install"
 export * from "./Like"