Merge pull request #250 from universi-me/feat#246/editar-criar-conteu…

…dos-materiais

Feat#246/editar criar conteudos materiais

src/components/ActionButton/ActionButton.tsx

@@ -1,14 +1,19 @@
+import { HTMLAttributes } from "react"
 import "./ActionButton.less"
 
 export interface ActionButtonProps{
     name : string
+    buttonProps?: HTMLAttributes<HTMLDivElement>;
 }
 
 export function ActionButton(props : ActionButtonProps){
+    const className = ["action-button-container", props.buttonProps?.className]
+        .filter(c => !!c && c.length > 0)
+        .join(" ");
 
 
     return(
-        <div className="action-button-container">
+        <div {...props.buttonProps} className={className}>
             <i className="bi bi-plus"></i>
             <div className="action-button-name">
                 {props.name}

src/components/ProfileInfo/ProfileBio/ProfileBio.tsx

@@ -26,8 +26,6 @@ export function ProfileBio(props: ProfileBioProps) {
         ? { backgroundImage: `url(${groupBannerUrl(props.organization)})` }
         : { backgroundColor: "var(--primary-color)" }
 
-    console.dir({headerBackground});
-
     return (
         <div className="profile-bio-component card">
 

src/pages/Group/Group.tsx

@@ -1,7 +1,7 @@
 import { useContext, useEffect, useState } from "react";
 import { Navigate, useLoaderData } from "react-router-dom";
 
-import { GroupContext, GroupIntro, GroupTabRenderer, GroupTabs, fetchGroupPageData, type AvailableTabs, type GroupContextType, type GroupPageLoaderResponse } from "@/pages/Group";
+import { GroupContext, GroupIntro, GroupTabRenderer, GroupTabs, fetchGroupPageData, type AvailableTabs, type GroupContextType, type GroupPageLoaderResponse, RefreshGroupOptions } from "@/pages/Group";
 import { ProfileBio, ProfileGroups } from "@/components/ProfileInfo";
 import { AuthContext } from "@/contexts/Auth";
 import "./Group.less";
@@ -50,9 +50,14 @@ export function GroupPage() {
         setCurrentTab(tab);
     }
 
-    async function refreshGroupData() {
+    async function refreshGroupData(options?: RefreshGroupOptions) {
         const data = await fetchGroupPageData({ groupPath: page.group?.path });
         const newContext = makeContext(data);
+
+        if (options?.currentContentId) {
+            newContext.currentContent = newContext.folders.find(c => c.id === options.currentContentId);
+        }
+
         setContext(newContext);
         return newContext;
     }
@@ -77,6 +82,16 @@ export function GroupPage() {
                 setContext({...this, currentContent: c});
             },
 
+            editContent: undefined,
+            setEditContent(c) {
+                setContext({...this, editContent: c});
+            },
+
+            editMaterial: undefined,
+            setEditMaterial(c) {
+                setContext({...this, editMaterial: c});
+            },
+
             refreshData: refreshGroupData,
         };
     }

src/pages/Group/GroupContext.tsx

@@ -1,7 +1,7 @@
 import { createContext } from "react";
 import { Group } from "@/types/Group";
 import { Profile } from "@/types/Profile";
-import { Folder } from "@/types/Capacity";
+import type { Content, Folder } from "@/types/Capacity";
 import { Link } from "@/types/Link";
 
 export type GroupContextType = null | {
@@ -13,14 +13,36 @@ export type GroupContextType = null | {
     currentContent: Folder | undefined;
     setCurrentContent(content: Folder | undefined): any;
 
+    /**
+     * The content being edited/created.
+     *
+     * If `null`, should handle creation of a content. If has a value, should handle
+     * content edit. If `undefined`, no content is being edited nor created.
+     */
+    editContent: Folder | null | undefined;
+    setEditContent(content: Folder | null | undefined): any;
+
+    /**
+     * The material being edited/created.
+     *
+     * If `null`, should handle creation of a material. If has a value, should handle
+     * material edit. If `undefined`, no material is being edited nor created.
+     */
+    editMaterial: Content | null | undefined;
+    setEditMaterial(material: Content | null | undefined): any;
+
     loggedData: {
         isParticipant: boolean;
         profile:       Profile;
         links:         Link[];
         groups:        Group[];
     };
 
-    refreshData: () => Promise<NonNullable<GroupContextType>>;
+    refreshData: (options?: RefreshGroupOptions) => Promise<NonNullable<GroupContextType>>;
 };
 
+export type RefreshGroupOptions = {
+    currentContentId?: string;
+}
+
 export const GroupContext = createContext<GroupContextType>(null);