diff --git a/frontend/src/components/Settings/InviteMemberPage.vue b/frontend/src/components/Settings/InviteMemberPage.vue
new file mode 100644
index 00000000..a29b7fe7
--- /dev/null
+++ b/frontend/src/components/Settings/InviteMemberPage.vue
@@ -0,0 +1,42 @@
+
+
+
+ {{ __('Send Invites To') }}
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/frontend/src/components/Settings/SettingsModal.vue b/frontend/src/components/Settings/SettingsModal.vue
index cdfad34c..16487387 100644
--- a/frontend/src/components/Settings/SettingsModal.vue
+++ b/frontend/src/components/Settings/SettingsModal.vue
@@ -40,6 +40,7 @@
import ContactsIcon from '@/components/Icons/ContactsIcon.vue'
import WhatsAppIcon from '@/components/Icons/WhatsAppIcon.vue'
import PhoneIcon from '@/components/Icons/PhoneIcon.vue'
+import InviteMemberPage from '@/components/Settings/InviteMemberPage.vue'
import ProfileSettings from '@/components/Settings/ProfileSettings.vue'
import WhatsAppSettings from '@/components/Settings/WhatsAppSettings.vue'
import TwilioSettings from '@/components/Settings/TwilioSettings.vue'
@@ -53,26 +54,31 @@ const show = defineModel()
const tabs = computed(() => {
let _tabs = [
{
- label: 'Settings',
+ label: __('Settings'),
hideLabel: true,
items: [
{
- label: 'Profile',
+ label: __('Profile'),
icon: ContactsIcon,
component: markRaw(ProfileSettings),
},
+ {
+ label: __('Invite Members'),
+ icon: 'user-plus',
+ component: markRaw(InviteMemberPage),
+ },
],
},
{
- label: 'Integrations',
+ label: __('Integrations'),
items: [
{
- label: 'Twilio',
+ label: __('Twilio'),
icon: PhoneIcon,
component: markRaw(TwilioSettings),
},
{
- label: 'WhatsApp',
+ label: __('WhatsApp'),
icon: WhatsAppIcon,
component: markRaw(WhatsAppSettings),
condition: () => isWhatsappInstalled.value,