The useActiveOrganization() hook provides access to the currently active organization and its management methods.

Import

import { useActiveOrganization } from '@snipextt/wacht';

Usage

import { useActiveOrganization } from '@snipextt/wacht';

function ActiveOrgDashboard() {
  const {
    activeOrganization,
    loading,
    getMembers,
    inviteMember,
    updateOrganization
  } = useActiveOrganization();

  if (loading) {
    return <div>Loading...</div>;
  }

  if (!activeOrganization) {
    return <div>No active organization</div>;
  }

  return (
    <div>
      <h1>{activeOrganization.name}</h1>
      <button onClick={async () => {
        const members = await getMembers();
        console.log('Members:', members);
      }}>
        View Members
      </button>
    </div>
  );
}

Properties

activeOrganization
Organization | null
The currently active organization object. null if no organization is active.
loading
boolean
Whether the active organization is being loaded
error
Error | null
Any error that occurred

Methods

updateOrganization()

Updates the active organization’s details.
const { updateOrganization } = useActiveOrganization();

await updateOrganization({
  name: 'New Organization Name',
  description: 'Updated description',
  image: newImageFile
});

getMembers()

Retrieves members of the active organization.
const { getMembers } = useActiveOrganization();

const members = await getMembers();

getRoles()

Retrieves available roles in the active organization.
const { getRoles } = useActiveOrganization();

const roles = await getRoles();

removeMember()

Removes a member from the active organization.
const { removeMember } = useActiveOrganization();

await removeMember(memberObject);

removeRole()

Removes a role from the active organization.
const { removeRole } = useActiveOrganization();

await removeRole(roleObject);

getInvitations()

Retrieves pending invitations for the active organization.
const { getInvitations } = useActiveOrganization();

const invitations = await getInvitations();

inviteMember()

Invites a new member to the active organization.
const { inviteMember } = useActiveOrganization();

const invitation = await inviteMember({
  email: 'newmember@example.com',
  organizationRole: roleObject,
  workspace: workspaceObject, // optional
  workspaceRole: workspaceRoleObject // optional
});

discardInvitation()

Cancels a pending invitation.
const { discardInvitation } = useActiveOrganization();

await discardInvitation(invitationObject);

resendInvitation()

Resends an invitation email.
const { resendInvitation } = useActiveOrganization();

await resendInvitation(invitationObject);

Domain Management

const { 
  getDomains,
  addDomain,
  verifyDomain,
  removeDomain 
} = useActiveOrganization();

// Get domains
const domains = await getDomains();

// Add domain
const domain = await addDomain({
  fqdn: 'example.com'
});

// Verify domain
await verifyDomain(domainObject);

// Remove domain
await removeDomain(domainObject);

Member Role Management

const { 
  addMemberRole,
  removeMemberRole 
} = useActiveOrganization();

// Add role to member
await addMemberRole(memberObject, roleObject);

// Remove role from member
await removeMemberRole(memberObject, roleObject);

leave()

Leave the current active organization.
const { leave } = useActiveOrganization();

await leave();

refetch()

Manually refreshes the active organization data.
const { refetch } = useActiveOrganization();

await refetch();

Example: Organization Management Panel

function OrganizationPanel() {
  const {
    activeOrganization,
    loading,
    getMembers,
    getRoles,
    inviteMember,
    updateOrganization
  } = useActiveOrganization();

  const [members, setMembers] = useState([]);
  const [roles, setRoles] = useState([]);
  const [showInviteForm, setShowInviteForm] = useState(false);

  useEffect(() => {
    if (activeOrganization) {
      loadOrganizationData();
    }
  }, [activeOrganization]);

  const loadOrganizationData = async () => {
    const [memberData, roleData] = await Promise.all([
      getMembers(),
      getRoles()
    ]);
    setMembers(memberData);
    setRoles(roleData);
  };

  const handleInvite = async (email, roleId) => {
    const role = roles.find(r => r.id === roleId);
    if (role) {
      await inviteMember({
        email,
        organizationRole: role
      });
      await loadOrganizationData();
    }
  };

  if (loading || !activeOrganization) {
    return <div>Loading...</div>;
  }

  return (
    <div>
      <header>
        <h1>{activeOrganization.name}</h1>
        <p>{activeOrganization.description}</p>
      </header>

      <section>
        <h2>Members ({members.length})</h2>
        <button onClick={() => setShowInviteForm(true)}>
          Invite Member
        </button>
        
        <div className="member-list">
          {members.map(member => (
            <div key={member.id} className="member-item">
              <span>{member.user.email}</span>
              <span>{member.role.name}</span>
            </div>
          ))}
        </div>
      </section>

      {showInviteForm && (
        <InviteForm
          roles={roles}
          onInvite={handleInvite}
          onClose={() => setShowInviteForm(false)}
        />
      )}
    </div>
  );
}

Notes

  • The active organization is determined by the current session context
  • All methods operate on the currently active organization
  • Methods will return undefined if no organization is active
  • Organization switching is handled through useSession().switchOrganization()
  • Changes to the active organization automatically update the UI