diff --git a/src/views/navigator/views/room-settings/views/tab-vipchat/NavigatorRoomSettingsVipChatTabView.tsx b/src/views/navigator/views/room-settings/views/tab-vipchat/NavigatorRoomSettingsVipChatTabView.tsx
new file mode 100644
index 00000000..e87b788c
--- /dev/null
+++ b/src/views/navigator/views/room-settings/views/tab-vipchat/NavigatorRoomSettingsVipChatTabView.tsx
@@ -0,0 +1,108 @@
+import { FC, useCallback } from 'react';
+import { LocalizeText } from '../../../../../../api';
+import { NavigatorRoomSettingsTabViewProps } from '../../NavigatorRoomSettingsView.types';
+
+export const NavigatorRoomSettingsVipChatTabView: FC
= props =>
+{
+ const { roomSettingsData = null, setRoomSettingsData = null, onSave = null } = props;
+
+ const handleChange = useCallback((field: string, value: string | number | boolean) =>
+ {
+ const clone = Object.assign({}, roomSettingsData);
+ let save = true;
+
+ switch(field)
+ {
+ case 'hide_walls':
+ clone.hideWalls = Boolean(value);
+ break;
+ case 'wall_thickness':
+ clone.wallThickness = Number(value);
+ break;
+ case 'floor_thickness':
+ clone.floorThickness = Number(value);
+ break;
+ case 'bubble_mode':
+ clone.chatBubbleMode = Number(value);
+ break;
+ case 'chat_weight':
+ clone.chatBubbleWeight = Number(value);
+ break;
+ case 'bubble_speed':
+ clone.chatBubbleSpeed = Number(value);
+ break;
+ case 'flood_protection':
+ clone.chatFloodProtection = Number(value);
+ break;
+ case 'chat_distance':
+ clone.chatDistance = Number(value);
+ save = false;
+ break;
+ }
+
+ setRoomSettingsData(clone);
+
+ if(save) onSave(clone);
+ }, [ roomSettingsData, setRoomSettingsData, onSave ]);
+
+ return (
+ <>
+ {LocalizeText('navigator.roomsettings.vip.caption')}
+ {LocalizeText('navigator.roomsettings.vip.info')}
+ {LocalizeText('navigator.roomsettings.vip_settings')}
+
+ handleChange('hide_walls', e.target.checked) } />
+
+
+
+
+
+
+
+
+ {LocalizeText('navigator.roomsettings.chat_settings')}
+ {LocalizeText('navigator.roomsettings.chat_settings.info')}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ handleChange('chat_distance', event.target.valueAsNumber) } onBlur={ () => onSave(roomSettingsData) } />
+
+ >
+ );
+}