Ekip İş Birliği

Not: Bu içerik, tanıtım amacıyla hazırlanmış örnek/yer tutucu bir içeriktir.

Yerleşik ekip yönetimi özellikleriyle ekiplerin etkili şekilde iş birliği yapmasını sağlayın.

Ekip Hesapları

Uygulama, birden fazla kullanıcının birlikte çalışabildiği çok kiracılı ekip hesaplarını destekler.

Ekip Oluşturma

Kullanıcılar yeni ekip hesapları oluşturabilir:

import { createTeamAccount } from '~/lib/teams/create-team';

const team = await createTeamAccount({
  name: 'Acme Corp',
  slug: 'acme-corp',
  ownerId: currentUser.id,
});

Ekip Çalışma Alanı

Her ekibin, verileri izole edilmiş kendi çalışma alanı vardır:

• Projeler ve kaynaklar
• Ekibe özel ayarlar
• Faturalandırma ve abonelik
• Etkinlik günlükleri

Üye Davet Etme

Davet Gönderme

Ekibinize yeni üyeler davet edin:

import { inviteTeamMember } from '~/lib/teams/invitations';

await inviteTeamMember({
  teamId: team.id,
  email: 'member@example.com',
  role: 'member',
});

Davet Akışı

1. Sahip, e-posta yoluyla davet gönderir
2. Alıcı, davet bağlantısını içeren e-postayı alır
3. Alıcı daveti kabul eder
4. Üye, ekip çalışma alanına erişim kazanır

Davetleri Yönetme

import { PendingInvitations } from '~/components/teams/pending-invitations';

<PendingInvitations teamId={team.id} />

Roller ve İzinler

Varsayılan Roller

Sahip

• Ekibe ve ayarlara tam erişim
• Faturalandırmayı ve abonelikleri yönetme
• Üye davet etme ve çıkarma
• Ekibi silme

Yönetici

• Ekip üyelerini yönetme
• Ekip kaynaklarını yönetme
• Faturalandırmaya erişemez
• Ekibi silemez

Üye

• Ekip kaynaklarını görüntüleme
• Kendi içeriğini oluşturma ve düzenleme
• Ekip ayarlarına sınırlı erişim

Özel Roller

Belirli izinlere sahip özel roller tanımlayın:

const customRole = {
  name: 'Editor',
  permissions: [
    'read:projects',
    'write:projects',
    'read:members',
  ],
};

İzinleri Kontrol Etme

import { checkPermission } from '~/lib/teams/permissions';

const canEdit = await checkPermission(userId, teamId, 'write:projects');

if (!canEdit) {
  throw new Error('Insufficient permissions');
}

Üye Yönetimi

Üyeleri Listeleme

import { getTeamMembers } from '~/lib/teams/members';

const members = await getTeamMembers(teamId);

Üye Rolünü Güncelleme

import { updateMemberRole } from '~/lib/teams/members';

await updateMemberRole({
  memberId: member.id,
  role: 'admin',
});

Üyeleri Çıkarma

import { removeMember } from '~/lib/teams/members';

await removeMember(memberId);

Ekip Ayarları

Ekip Bilgilerini Güncelleme

'use client';

import { useForm } from 'react-hook-form';
import { updateTeamAction } from '../_lib/server/actions';

export function TeamSettingsForm({ team }) {
  const { register, handleSubmit } = useForm({
    defaultValues: {
      name: team.name,
      description: team.description,
    },
  });

  const onSubmit = async (data) => {
    await updateTeamAction({ teamId: team.id, ...data });
  };

  return (
    <form onSubmit={handleSubmit(onSubmit)}>
      <input {...register('name')} placeholder="Team name" />
      <textarea {...register('description')} placeholder="Description" />
      <button type="submit">Save Changes</button>
    </form>
  );
}

Ekip Avatarı

import { uploadTeamAvatar } from '~/lib/teams/avatar';

const avatarUrl = await uploadTeamAvatar({
  teamId: team.id,
  file: avatarFile,
});

Etkinlik Günlüğü

Şeffaflık için ekip etkinliklerini takip edin:

import { logActivity } from '~/lib/teams/activity';

await logActivity({
  teamId: team.id,
  userId: user.id,
  action: 'member_invited',
  metadata: {
    invitedEmail: 'new@example.com',
  },
});

Etkinlikleri Görüntüleme

import { getTeamActivity } from '~/lib/teams/activity';

const activities = await getTeamActivity(teamId, {
  limit: 50,
  offset: 0,
});

Ekip Değiştirme

Kullanıcıların ekipleri arasında geçiş yapmasına olanak tanıyın:

'use client';

import { useTeamAccountWorkspace } from '@kit/team-accounts/hooks/use-team-account-workspace';

export function TeamSwitcher() {
  const { accounts, account } = useTeamAccountWorkspace();

  return (
    <select
      value={account.id}
      onChange={(e) => switchTeam(e.target.value)}
    >
      {accounts.map((team) => (
        <option key={team.id} value={team.id}>
          {team.name}
        </option>
      ))}
    </select>
  );
}

Bildirimler

Üye Katıldı

await createNotification({
  teamId: team.id,
  title: 'New Member',
  message: `${user.name} joined the team`,
  type: 'info',
});

Rol Değişti

await createNotification({
  userId: member.userId,
  title: 'Role Updated',
  message: `Your role was changed to ${newRole}`,
  type: 'info',
});

En İyi Uygulamalar

1. Net rol hiyerarşisi - Kullanım senaryonuza uygun roller tanımlayın
2. En az ayrıcalık ilkesi - Gereken minimum izinleri verin
3. Denetim izi - Önemli ekip eylemlerini günlüğe kaydedin
4. Kolay katılım - Basit bir davet süreci sunun
5. Self servis - Üyelerin kendi ayarlarını yönetmesine izin verin
6. Şeffaf faturalandırma - Kullanımı ve maliyetleri açıkça gösterin