Add members invite, role change, and remove CRUD

[suporterfid]

Summary

• Tenant-admin invite/create membership (existing or new user + password reset)
• Role change and remove with last-admin and self-remove guards + audit events
• Inline /members UI matching Environments/API Keys

Test plan

• Invite existing user and new email on https://hub.taskconnect.com.br/members
• Change role; demoting last admin fails
• Remove member; self-remove and last-admin remove fail
• Non-admin can list but gets 403 on write

Made with Cursor

[gemini-code-assist]

Code Review

This pull request implements the Members CRUD functionality, allowing tenant administrators to invite members, update their roles, and remove them. The backend changes introduce a new MemberService, MemberPolicy, and corresponding controller endpoints with audit logging and feature tests. On the frontend, MembersPage.vue is updated with inline forms for inviting and editing members, alongside localization support and updated TypeScript types. The review feedback highlights several dark mode styling omissions in the new frontend form and table components, which can cause readability and contrast issues on dark backgrounds.

Important

The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.

[gemini-code-assist]

The form labels and input fields lack dark mode classes. In dark mode, the form container has a dark background (dark:bg-gray-900), but these inputs will remain white with low-contrast labels, making them hard to read and visually inconsistent. Let's add appropriate Tailwind dark mode classes (dark:text-gray-300, dark:border-gray-700, dark:bg-gray-800, dark:text-gray-100) to ensure a seamless dark mode experience.

        <label v-if="!editingId" class="block">
          <span class="mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300">{{
            $t('settings.members.fields.email')
          }}</span>
          <input
            v-model="form.email"
            type="email"
            required
            class="w-full rounded-md border border-gray-300 bg-white px-3 py-2 text-sm text-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100"
          />
        </label>
        <label v-if="!editingId" class="block">
          <span class="mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300">{{
            $t('settings.members.fields.name')
          }}</span>
          <input
            v-model="form.name"
            class="w-full rounded-md border border-gray-300 bg-white px-3 py-2 text-sm text-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100"
          />
          <span class="mt-1 block text-xs text-gray-500 dark:text-gray-400">{{
            $t('settings.members.fields.nameHint')
          }}</span>
        </label>

[gemini-code-assist]

Similarly, the role select element and its label should also support dark mode to match the rest of the form.

        <label class="block">
          <span class="mb-1 block text-sm font-medium text-gray-700 dark:text-gray-300">{{
            $t('settings.members.fields.role')
          }}</span>
          <select
            v-model="form.role"
            required
            class="w-full rounded-md border border-gray-300 bg-white px-3 py-2 text-sm text-gray-900 dark:border-gray-700 dark:bg-gray-800 dark:text-gray-100"
          >
            <option v-for="role in ROLE_OPTIONS" :key="role" :value="role">
              {{ roleLabel(role) }}
            </option>
          </select>
        </label>

[gemini-code-assist]

The text-gray-600 class has very low contrast on dark backgrounds (like dark:bg-gray-950). Let's add dark:text-gray-400 to ensure the email address is readable in dark mode.

            <td class="px-4 py-3 text-sm text-gray-600 dark:text-gray-400">{{ member.email }}</td>