Add disable attribute for no permission buttons and shorten query param names

web-app/src/routes/(authenticated)/website/[websiteId]/collaborators/+page.server.ts

@@ -2,7 +2,7 @@ import type { Actions, PageServerLoad } from "./$types";
 import { API_BASE_PREFIX, apiRequest } from "$lib/server/utils";
 import type { Collab, User } from "$lib/db-schema";
 
-export const load: PageServerLoad = async ({ parent, params, fetch }) => {
+export const load: PageServerLoad = async ({ parent, params, fetch, locals }) => {
   const collaborators: (Collab & { user: User })[] = (
     await apiRequest(
       fetch,
@@ -14,12 +14,14 @@ export const load: PageServerLoad = async ({ parent, params, fetch }) => {
     )
   ).data;
 
-  const { website, home } = await parent();
+  const { website, home, permissionLevel } = await parent();
 
   return {
     website,
     home,
-    collaborators
+    collaborators,
+    permissionLevel,
+    user: locals.user
   };
 };
 

web-app/src/routes/(authenticated)/website/[websiteId]/collaborators/+page.svelte

@@ -51,7 +51,7 @@
           </select>
         </label>
 
-        <button type="submit">Submit</button>
+        <button type="submit" disabled={[10, 20].includes(data.permissionLevel)}>Submit</button>
       </form>
     </Modal>
   </section>
@@ -89,7 +89,11 @@
                     </select>
                   </label>
 
-                  <button type="submit">Update collaborator</button>
+                  <button
+                    type="submit"
+                    disabled={[10, 20].includes(data.permissionLevel) || user_id === data.user.id}
+                    >Update collaborator</button
+                  >
                 </form>
               </Modal>
               <Modal id="remove-collaborator-{user_id}" text="Remove">
@@ -104,7 +108,11 @@
                 >
                   <input type="hidden" name="user-id" value={user_id} />
 
-                  <button type="submit">Remove collaborator</button>
+                  <button
+                    type="submit"
+                    disabled={[10, 20].includes(data.permissionLevel) || user_id === data.user.id}
+                    >Remove collaborator</button
+                  >
                 </form>
               </Modal>
             </div>