From a55f33578eb3ff99614cee1f96efe57090f47720 Mon Sep 17 00:00:00 2001
From: MyNameIsBatman <montevechiol@gmail.com>
Date: Wed, 15 Sep 2021 13:26:51 -0300
Subject: [PATCH] Dimmer and Friends stuff

---
 public/renderer-config.json                   |  1 +
 public/ui-config.json                         | 19 +-------------
 .../friend-list/FriendListContentEvent.ts     |  2 +-
 .../item/NitroCardAccordionItemView.tsx       |  9 +++++--
 .../item/NitroCardAccordionItemView.types.ts  |  1 +
 src/views/Styles.scss                         |  2 +-
 src/views/friend-list/FriendListView.scss     |  5 ----
 .../views/friends/FriendListFriendsView.tsx   | 17 -------------
 .../friends/FriendListFriendsView.types.ts    |  5 ----
 .../FriendListRequestsItemView.types.ts       |  6 -----
 .../views/requests/FriendListRequestsView.tsx | 17 -------------
 .../requests/FriendListRequestsView.types.ts  |  6 -----
 .../FriendListMessageHandler.tsx              |  0
 .../FriendListMessageHandler.types.ts         |  0
 src/views/friends/FriendsView.scss            |  5 ++++
 .../FriendsView.tsx}                          | 14 +++++------
 .../FriendsView.types.ts}                     |  3 ---
 .../common/MessengerFriend.ts                 |  0
 .../common/MessengerRequest.ts                |  0
 .../common/MessengerSettings.ts               |  0
 .../context/FriendListContext.tsx             |  0
 .../context/FriendListContext.type.ts         |  0
 .../reducers/FriendListReducer.tsx            |  0
 .../friend-bar-item/FriendBarItemView.scss    |  0
 .../friend-bar-item/FriendBarItemView.tsx     |  0
 .../FriendBarItemView.types.ts                |  0
 .../views/friend-bar/FriendBarView.scss       |  0
 .../views/friend-bar/FriendBarView.tsx        |  0
 .../views/friend-bar/FriendBarView.types.ts   |  0
 .../friend-item/FriendsListItemView.tsx}      |  4 +--
 .../friend-item/FriendsListItemView.types.ts} |  2 +-
 .../friends/views/list/FriendsListView.tsx    | 25 +++++++++++++++++++
 .../views/list/FriendsListView.types.ts       |  7 ++++++
 .../request-item/FriendsRequestItemView.tsx}  |  4 +--
 .../FriendsRequestItemView.types.ts           |  6 +++++
 src/views/main/MainView.tsx                   |  4 +--
 .../furniture/dimmer/FurnitureDimmerView.scss |  4 +++
 .../furniture/dimmer/FurnitureDimmerView.tsx  | 19 ++++++++++++--
 38 files changed, 89 insertions(+), 98 deletions(-)
 delete mode 100644 src/views/friend-list/FriendListView.scss
 delete mode 100644 src/views/friend-list/views/friends/FriendListFriendsView.tsx
 delete mode 100644 src/views/friend-list/views/friends/FriendListFriendsView.types.ts
 delete mode 100644 src/views/friend-list/views/requests-item/FriendListRequestsItemView.types.ts
 delete mode 100644 src/views/friend-list/views/requests/FriendListRequestsView.tsx
 delete mode 100644 src/views/friend-list/views/requests/FriendListRequestsView.types.ts
 rename src/views/{friend-list => friends}/FriendListMessageHandler.tsx (100%)
 rename src/views/{friend-list => friends}/FriendListMessageHandler.types.ts (100%)
 create mode 100644 src/views/friends/FriendsView.scss
 rename src/views/{friend-list/FriendListView.tsx => friends/FriendsView.tsx} (91%)
 rename src/views/{friend-list/FriendListView.types.ts => friends/FriendsView.types.ts} (85%)
 rename src/views/{friend-list => friends}/common/MessengerFriend.ts (100%)
 rename src/views/{friend-list => friends}/common/MessengerRequest.ts (100%)
 rename src/views/{friend-list => friends}/common/MessengerSettings.ts (100%)
 rename src/views/{friend-list => friends}/context/FriendListContext.tsx (100%)
 rename src/views/{friend-list => friends}/context/FriendListContext.type.ts (100%)
 rename src/views/{friend-list => friends}/reducers/FriendListReducer.tsx (100%)
 rename src/views/{friend-list => friends}/views/friend-bar-item/FriendBarItemView.scss (100%)
 rename src/views/{friend-list => friends}/views/friend-bar-item/FriendBarItemView.tsx (100%)
 rename src/views/{friend-list => friends}/views/friend-bar-item/FriendBarItemView.types.ts (100%)
 rename src/views/{friend-list => friends}/views/friend-bar/FriendBarView.scss (100%)
 rename src/views/{friend-list => friends}/views/friend-bar/FriendBarView.tsx (100%)
 rename src/views/{friend-list => friends}/views/friend-bar/FriendBarView.types.ts (100%)
 rename src/views/{friend-list/views/friends-item/FriendListFriendsItemView.tsx => friends/views/friend-item/FriendsListItemView.tsx} (94%)
 rename src/views/{friend-list/views/friends-item/FriendListFriendsItemView.types.ts => friends/views/friend-item/FriendsListItemView.types.ts} (67%)
 create mode 100644 src/views/friends/views/list/FriendsListView.tsx
 create mode 100644 src/views/friends/views/list/FriendsListView.types.ts
 rename src/views/{friend-list/views/requests-item/FriendListRequestsItemView.tsx => friends/views/request-item/FriendsRequestItemView.tsx} (87%)
 create mode 100644 src/views/friends/views/request-item/FriendsRequestItemView.types.ts

diff --git a/public/renderer-config.json b/public/renderer-config.json
index bf3a12a3..bd228c88 100644
--- a/public/renderer-config.json
+++ b/public/renderer-config.json
@@ -33,6 +33,7 @@
     "system.packet.log": false,
     "system.pong.manually": true,
     "system.pong.interval.ms": 20000,
+    "room.color.skip.transition": true,
     "avatar.mandatory.libraries": [
         "bd:1",
         "li:0"
diff --git a/public/ui-config.json b/public/ui-config.json
index 0551121f..4a51def7 100644
--- a/public/ui-config.json
+++ b/public/ui-config.json
@@ -5,24 +5,7 @@
     "thumbnails.url": "https://nitro.nitrots.co/camera/thumbnail/%thumbnail%.png",
     "url.prefix": "http://localhost:3000",
     "chat.viewer.height.percentage": 0.40,
-    "navigator.slider.enabled": true,
-    "navigator.slider.content": [
-        {
-            "title": "Games Hub",
-            "image": "https://i.imgur.com/TFoivxi.png",
-            "roomId": 2240
-        },
-        {
-            "title": "Help Desk",
-            "image": "https://i.imgur.com/GO981GC.png",
-            "roomId": 2351
-        },
-        {
-            "title": "The Lido",
-            "image": "https://i.imgur.com/NVH38bV.png",
-            "roomId": 2346
-        }
-    ],
+    "widget.dimmer.colorwheel": true,
     "hotelview": {
         "widgets": {
             "slot.1.widget": "promoarticle",
diff --git a/src/events/friend-list/FriendListContentEvent.ts b/src/events/friend-list/FriendListContentEvent.ts
index 4527d67c..a7623cbc 100644
--- a/src/events/friend-list/FriendListContentEvent.ts
+++ b/src/events/friend-list/FriendListContentEvent.ts
@@ -1,4 +1,4 @@
-import { MessengerFriend } from '../../views/friend-list/common/MessengerFriend';
+import { MessengerFriend } from '../../views/friends/common/MessengerFriend';
 import { FriendListEvent } from './FriendListEvent';
 
 export class FriendListContentEvent extends FriendListEvent
diff --git a/src/layout/card/accordion/item/NitroCardAccordionItemView.tsx b/src/layout/card/accordion/item/NitroCardAccordionItemView.tsx
index acdd4e2f..e1cb135d 100644
--- a/src/layout/card/accordion/item/NitroCardAccordionItemView.tsx
+++ b/src/layout/card/accordion/item/NitroCardAccordionItemView.tsx
@@ -1,12 +1,17 @@
-import { FC, useState } from 'react';
+import { FC, useEffect, useState } from 'react';
 import { NitroCardAccordionItemViewProps } from './NitroCardAccordionItemView.types';
 
 export const NitroCardAccordionItemView: FC<NitroCardAccordionItemViewProps> = props =>
 {
-    const { className = '', headerClassName = '', contentClassName = '', headerText = '' } = props;
+    const { className = '', headerClassName = '', contentClassName = '', headerText = '', defaultState = false } = props;
 
     const [ isExpanded, setIsExpanded ] = useState(false);
 
+    useEffect(() =>
+    {
+        setIsExpanded(defaultState);
+    }, [ defaultState ]);
+
     return (
         <div className={ 'nitro-card-accordion-item ' + className + (isExpanded ? ' active' : '') }>
             <div className={ 'nitro-card-accordion-item-header px-2 py-1 d-flex ' + headerClassName } onClick={ () => setIsExpanded((value) => !value) }>
diff --git a/src/layout/card/accordion/item/NitroCardAccordionItemView.types.ts b/src/layout/card/accordion/item/NitroCardAccordionItemView.types.ts
index c3290126..771ef503 100644
--- a/src/layout/card/accordion/item/NitroCardAccordionItemView.types.ts
+++ b/src/layout/card/accordion/item/NitroCardAccordionItemView.types.ts
@@ -4,4 +4,5 @@ export interface NitroCardAccordionItemViewProps
     headerClassName?: string;
     contentClassName?: string;
     headerText: string;
+    defaultState?: boolean;
 }
diff --git a/src/views/Styles.scss b/src/views/Styles.scss
index eecc2119..4f31d9e5 100644
--- a/src/views/Styles.scss
+++ b/src/views/Styles.scss
@@ -2,7 +2,7 @@
 @import './avatar-editor/AvatarEditorView';
 @import './camera/CameraWidgetView';
 @import './catalog/CatalogView';
-@import './friend-list/FriendListView';
+@import './friends/FriendsView';
 @import './groups/GroupView';
 @import './hotel-view/HotelView';
 @import './inventory/InventoryView';
diff --git a/src/views/friend-list/FriendListView.scss b/src/views/friend-list/FriendListView.scss
deleted file mode 100644
index c4e98765..00000000
--- a/src/views/friend-list/FriendListView.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.nitro-friend-list {
-    width: 250px;
-}
-
-@import './views//friend-bar/FriendBarView';
diff --git a/src/views/friend-list/views/friends/FriendListFriendsView.tsx b/src/views/friend-list/views/friends/FriendListFriendsView.tsx
deleted file mode 100644
index 7779c50c..00000000
--- a/src/views/friend-list/views/friends/FriendListFriendsView.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { FC } from 'react';
-import { FriendListFriendsItemView } from '../friends-item/FriendListFriendsItemView';
-import { FriendListFriendsViewProps } from './FriendListFriendsView.types';
-
-export const FriendListFriendsView: FC<FriendListFriendsViewProps> = props =>
-{
-    const { list = null } = props;
-
-    if(!list) return null;
-
-    return (<>
-        { list.map((friend, index) =>
-        {
-            return <FriendListFriendsItemView key={ index } friend={ friend } />
-        }) }
-    </>);
-}
diff --git a/src/views/friend-list/views/friends/FriendListFriendsView.types.ts b/src/views/friend-list/views/friends/FriendListFriendsView.types.ts
deleted file mode 100644
index b9727b9c..00000000
--- a/src/views/friend-list/views/friends/FriendListFriendsView.types.ts
+++ /dev/null
@@ -1,5 +0,0 @@
-import { MessengerFriend } from './../../common/MessengerFriend';
-export interface FriendListFriendsViewProps
-{
-    list: MessengerFriend[];
-}
diff --git a/src/views/friend-list/views/requests-item/FriendListRequestsItemView.types.ts b/src/views/friend-list/views/requests-item/FriendListRequestsItemView.types.ts
deleted file mode 100644
index bfef7b6b..00000000
--- a/src/views/friend-list/views/requests-item/FriendListRequestsItemView.types.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { MessengerRequest } from './../../common/MessengerRequest';
-
-export interface FriendListRequestsItemViewProps
-{
-    request: MessengerRequest;
-}
diff --git a/src/views/friend-list/views/requests/FriendListRequestsView.tsx b/src/views/friend-list/views/requests/FriendListRequestsView.tsx
deleted file mode 100644
index 9041f49c..00000000
--- a/src/views/friend-list/views/requests/FriendListRequestsView.tsx
+++ /dev/null
@@ -1,17 +0,0 @@
-import { FC } from 'react';
-import { FriendListRequestsItemView } from '../requests-item/FriendListRequestsItemView';
-import { FriendListRequestsViewProps } from './FriendListRequestsView.types';
-
-export const FriendListRequestsView: FC<FriendListRequestsViewProps> = props =>
-{
-    const { list = null } = props;
-
-    if(!list) return null;
-
-    return (<>
-        { list.map((request, index) =>
-        {
-            return <FriendListRequestsItemView key={ index } request={ request } />
-        }) }
-    </>);
-};
diff --git a/src/views/friend-list/views/requests/FriendListRequestsView.types.ts b/src/views/friend-list/views/requests/FriendListRequestsView.types.ts
deleted file mode 100644
index 4c968d8e..00000000
--- a/src/views/friend-list/views/requests/FriendListRequestsView.types.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { MessengerRequest } from './../../common/MessengerRequest';
-
-export interface FriendListRequestsViewProps
-{
-    list: MessengerRequest[];
-}
diff --git a/src/views/friend-list/FriendListMessageHandler.tsx b/src/views/friends/FriendListMessageHandler.tsx
similarity index 100%
rename from src/views/friend-list/FriendListMessageHandler.tsx
rename to src/views/friends/FriendListMessageHandler.tsx
diff --git a/src/views/friend-list/FriendListMessageHandler.types.ts b/src/views/friends/FriendListMessageHandler.types.ts
similarity index 100%
rename from src/views/friend-list/FriendListMessageHandler.types.ts
rename to src/views/friends/FriendListMessageHandler.types.ts
diff --git a/src/views/friends/FriendsView.scss b/src/views/friends/FriendsView.scss
new file mode 100644
index 00000000..1d882087
--- /dev/null
+++ b/src/views/friends/FriendsView.scss
@@ -0,0 +1,5 @@
+.nitro-friend-list {
+    width: 250px;
+}
+
+@import './views/friend-bar/FriendBarView';
diff --git a/src/views/friend-list/FriendListView.tsx b/src/views/friends/FriendsView.tsx
similarity index 91%
rename from src/views/friend-list/FriendListView.tsx
rename to src/views/friends/FriendsView.tsx
index 06ebf3b4..6e2d74eb 100644
--- a/src/views/friend-list/FriendListView.tsx
+++ b/src/views/friends/FriendsView.tsx
@@ -11,15 +11,13 @@ import { SendMessageHook } from '../../hooks/messages/message-event';
 import { NitroCardAccordionItemView, NitroCardAccordionView, NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, NitroCardTabsView, NitroCardView } from '../../layout';
 import { FriendListContextProvider } from './context/FriendListContext';
 import { FriendListMessageHandler } from './FriendListMessageHandler';
-import { FriendListViewProps } from './FriendListView.types';
 import { FriendListReducer, initialFriendList } from './reducers/FriendListReducer';
 import { FriendBarView } from './views/friend-bar/FriendBarView';
-import { FriendListFriendsView } from './views/friends/FriendListFriendsView';
-import { FriendListRequestsView } from './views/requests/FriendListRequestsView';
+import { FriendsListView } from './views/list/FriendsListView';
 
 const TABS: string[] = ['friendlist.friends', 'generic.search'];
 
-export const FriendListView: FC<FriendListViewProps> = props =>
+export const FriendsView: FC<{}> = props =>
 {
     const [ friendListState, dispatchFriendListState ] = useReducer(FriendListReducer, initialFriendList);
     const { friends = null, requests = null, settings = null } = friendListState;
@@ -120,14 +118,14 @@ export const FriendListView: FC<FriendListViewProps> = props =>
                         </NitroCardTabsView>
                         <div className="text-black">
                             { currentTab === 0 && <NitroCardAccordionView>
-                                <NitroCardAccordionItemView headerText={ LocalizeText('friendlist.friends') + ` (${onlineFriends.length})` }>
-                                   <FriendListFriendsView list={ onlineFriends } />
+                                <NitroCardAccordionItemView headerText={ LocalizeText('friendlist.friends') + ` (${onlineFriends.length})` } defaultState={ true }>
+                                   <FriendsListView list={ onlineFriends } />
                                 </NitroCardAccordionItemView>
                                 <NitroCardAccordionItemView headerText={ LocalizeText('friendlist.friends.offlinecaption') + ` (${offlineFriends.length})` }>
-                                    <FriendListFriendsView list={ offlineFriends } />
+                                    <FriendsListView list={ offlineFriends } />
                                 </NitroCardAccordionItemView>
                                 { requests.length > 0 && <NitroCardAccordionItemView headerText={ LocalizeText('friendlist.tab.friendrequests') + ` (${requests.length})` }>
-                                    <FriendListRequestsView list={ requests } />
+                                    <FriendsListView list={ requests } />
                                 </NitroCardAccordionItemView> }
                             </NitroCardAccordionView> }
                         </div>
diff --git a/src/views/friend-list/FriendListView.types.ts b/src/views/friends/FriendsView.types.ts
similarity index 85%
rename from src/views/friend-list/FriendListView.types.ts
rename to src/views/friends/FriendsView.types.ts
index 9c7675de..14fa8b5c 100644
--- a/src/views/friend-list/FriendListView.types.ts
+++ b/src/views/friends/FriendsView.types.ts
@@ -1,6 +1,3 @@
-export interface FriendListViewProps
-{}
-
 export class FriendListTabs
 {
     public static readonly FRIENDS: string  = 'friendlist.friends';
diff --git a/src/views/friend-list/common/MessengerFriend.ts b/src/views/friends/common/MessengerFriend.ts
similarity index 100%
rename from src/views/friend-list/common/MessengerFriend.ts
rename to src/views/friends/common/MessengerFriend.ts
diff --git a/src/views/friend-list/common/MessengerRequest.ts b/src/views/friends/common/MessengerRequest.ts
similarity index 100%
rename from src/views/friend-list/common/MessengerRequest.ts
rename to src/views/friends/common/MessengerRequest.ts
diff --git a/src/views/friend-list/common/MessengerSettings.ts b/src/views/friends/common/MessengerSettings.ts
similarity index 100%
rename from src/views/friend-list/common/MessengerSettings.ts
rename to src/views/friends/common/MessengerSettings.ts
diff --git a/src/views/friend-list/context/FriendListContext.tsx b/src/views/friends/context/FriendListContext.tsx
similarity index 100%
rename from src/views/friend-list/context/FriendListContext.tsx
rename to src/views/friends/context/FriendListContext.tsx
diff --git a/src/views/friend-list/context/FriendListContext.type.ts b/src/views/friends/context/FriendListContext.type.ts
similarity index 100%
rename from src/views/friend-list/context/FriendListContext.type.ts
rename to src/views/friends/context/FriendListContext.type.ts
diff --git a/src/views/friend-list/reducers/FriendListReducer.tsx b/src/views/friends/reducers/FriendListReducer.tsx
similarity index 100%
rename from src/views/friend-list/reducers/FriendListReducer.tsx
rename to src/views/friends/reducers/FriendListReducer.tsx
diff --git a/src/views/friend-list/views/friend-bar-item/FriendBarItemView.scss b/src/views/friends/views/friend-bar-item/FriendBarItemView.scss
similarity index 100%
rename from src/views/friend-list/views/friend-bar-item/FriendBarItemView.scss
rename to src/views/friends/views/friend-bar-item/FriendBarItemView.scss
diff --git a/src/views/friend-list/views/friend-bar-item/FriendBarItemView.tsx b/src/views/friends/views/friend-bar-item/FriendBarItemView.tsx
similarity index 100%
rename from src/views/friend-list/views/friend-bar-item/FriendBarItemView.tsx
rename to src/views/friends/views/friend-bar-item/FriendBarItemView.tsx
diff --git a/src/views/friend-list/views/friend-bar-item/FriendBarItemView.types.ts b/src/views/friends/views/friend-bar-item/FriendBarItemView.types.ts
similarity index 100%
rename from src/views/friend-list/views/friend-bar-item/FriendBarItemView.types.ts
rename to src/views/friends/views/friend-bar-item/FriendBarItemView.types.ts
diff --git a/src/views/friend-list/views/friend-bar/FriendBarView.scss b/src/views/friends/views/friend-bar/FriendBarView.scss
similarity index 100%
rename from src/views/friend-list/views/friend-bar/FriendBarView.scss
rename to src/views/friends/views/friend-bar/FriendBarView.scss
diff --git a/src/views/friend-list/views/friend-bar/FriendBarView.tsx b/src/views/friends/views/friend-bar/FriendBarView.tsx
similarity index 100%
rename from src/views/friend-list/views/friend-bar/FriendBarView.tsx
rename to src/views/friends/views/friend-bar/FriendBarView.tsx
diff --git a/src/views/friend-list/views/friend-bar/FriendBarView.types.ts b/src/views/friends/views/friend-bar/FriendBarView.types.ts
similarity index 100%
rename from src/views/friend-list/views/friend-bar/FriendBarView.types.ts
rename to src/views/friends/views/friend-bar/FriendBarView.types.ts
diff --git a/src/views/friend-list/views/friends-item/FriendListFriendsItemView.tsx b/src/views/friends/views/friend-item/FriendsListItemView.tsx
similarity index 94%
rename from src/views/friend-list/views/friends-item/FriendListFriendsItemView.tsx
rename to src/views/friends/views/friend-item/FriendsListItemView.tsx
index 23e053de..b8d4d75a 100644
--- a/src/views/friend-list/views/friends-item/FriendListFriendsItemView.tsx
+++ b/src/views/friends/views/friend-item/FriendsListItemView.tsx
@@ -4,9 +4,9 @@ import { LocalizeText } from '../../../../api';
 import { SendMessageHook } from '../../../../hooks';
 import { UserProfileIconView } from '../../../shared/user-profile-icon/UserProfileIconView';
 import { MessengerFriend } from '../../common/MessengerFriend';
-import { FriendListFriendsItemViewProps } from './FriendListFriendsItemView.types';
+import { FriendsListItemViewProps } from './FriendsListItemView.types';
 
-export const FriendListFriendsItemView: FC<FriendListFriendsItemViewProps> = props =>
+export const FriendsListItemView: FC<FriendsListItemViewProps> = props =>
 {
     const { friend = null } = props;
 
diff --git a/src/views/friend-list/views/friends-item/FriendListFriendsItemView.types.ts b/src/views/friends/views/friend-item/FriendsListItemView.types.ts
similarity index 67%
rename from src/views/friend-list/views/friends-item/FriendListFriendsItemView.types.ts
rename to src/views/friends/views/friend-item/FriendsListItemView.types.ts
index a64cbd3b..df44d3b5 100644
--- a/src/views/friend-list/views/friends-item/FriendListFriendsItemView.types.ts
+++ b/src/views/friends/views/friend-item/FriendsListItemView.types.ts
@@ -1,6 +1,6 @@
 import { MessengerFriend } from '../../common/MessengerFriend';
 
-export interface FriendListFriendsItemViewProps
+export interface FriendsListItemViewProps
 {
     friend: MessengerFriend;
 }
diff --git a/src/views/friends/views/list/FriendsListView.tsx b/src/views/friends/views/list/FriendsListView.tsx
new file mode 100644
index 00000000..86ed2707
--- /dev/null
+++ b/src/views/friends/views/list/FriendsListView.tsx
@@ -0,0 +1,25 @@
+import React, { FC } from 'react';
+import { MessengerFriend } from '../../common/MessengerFriend';
+import { MessengerRequest } from '../../common/MessengerRequest';
+import { FriendsListItemView } from '../friend-item/FriendsListItemView';
+import { FriendsRequestItemView } from '../request-item/FriendsRequestItemView';
+import { FriendsListViewProps } from './FriendsListView.types';
+
+export const FriendsListView: FC<FriendsListViewProps> = props =>
+{
+    const { list =  null } = props;
+
+    if(!list) return null;
+
+    return (<>
+        { list.map((item, index) =>
+        {
+            if(item instanceof MessengerFriend)
+                return <FriendsListItemView key={ index } friend={ item } />
+            else if(item instanceof MessengerRequest)
+                return  <FriendsRequestItemView key={ index } request={ item } />
+            else
+                return null;
+        }) }
+    </>);
+}
diff --git a/src/views/friends/views/list/FriendsListView.types.ts b/src/views/friends/views/list/FriendsListView.types.ts
new file mode 100644
index 00000000..8a4c4bc9
--- /dev/null
+++ b/src/views/friends/views/list/FriendsListView.types.ts
@@ -0,0 +1,7 @@
+import { MessengerFriend } from '../../common/MessengerFriend';
+import { MessengerRequest } from '../../common/MessengerRequest';
+
+export interface FriendsListViewProps
+{
+    list: MessengerFriend[] | MessengerRequest[];
+}
diff --git a/src/views/friend-list/views/requests-item/FriendListRequestsItemView.tsx b/src/views/friends/views/request-item/FriendsRequestItemView.tsx
similarity index 87%
rename from src/views/friend-list/views/requests-item/FriendListRequestsItemView.tsx
rename to src/views/friends/views/request-item/FriendsRequestItemView.tsx
index 2763162f..6138d4fe 100644
--- a/src/views/friend-list/views/requests-item/FriendListRequestsItemView.tsx
+++ b/src/views/friends/views/request-item/FriendsRequestItemView.tsx
@@ -2,9 +2,9 @@ import { AcceptFriendComposer, DeclineFriendComposer } from '@nitrots/nitro-rend
 import { FC, useCallback } from 'react';
 import { SendMessageHook } from '../../../../hooks/messages/message-event';
 import { UserProfileIconView } from '../../../shared/user-profile-icon/UserProfileIconView';
-import { FriendListRequestsItemViewProps } from './FriendListRequestsItemView.types';
+import { FriendsRequestItemViewProps } from './FriendsRequestItemView.types';
 
-export const FriendListRequestsItemView: FC<FriendListRequestsItemViewProps> = props =>
+export const FriendsRequestItemView: FC<FriendsRequestItemViewProps> = props =>
 {
     const { request = null } = props;
 
diff --git a/src/views/friends/views/request-item/FriendsRequestItemView.types.ts b/src/views/friends/views/request-item/FriendsRequestItemView.types.ts
new file mode 100644
index 00000000..4f5c38d5
--- /dev/null
+++ b/src/views/friends/views/request-item/FriendsRequestItemView.types.ts
@@ -0,0 +1,6 @@
+import { MessengerRequest } from '../../common/MessengerRequest';
+
+export interface FriendsRequestItemViewProps
+{
+    request: MessengerRequest;
+}
diff --git a/src/views/main/MainView.tsx b/src/views/main/MainView.tsx
index c3618be1..68269e58 100644
--- a/src/views/main/MainView.tsx
+++ b/src/views/main/MainView.tsx
@@ -7,7 +7,7 @@ import { AchievementsView } from '../achievements/AchievementsView';
 import { AvatarEditorView } from '../avatar-editor/AvatarEditorView';
 import { CameraWidgetView } from '../camera/CameraWidgetView';
 import { CatalogView } from '../catalog/CatalogView';
-import { FriendListView } from '../friend-list/FriendListView';
+import { FriendsView } from '../friends/FriendsView';
 import { GroupsView } from '../groups/GroupsView';
 import { HotelView } from '../hotel-view/HotelView';
 import { InventoryView } from '../inventory/InventoryView';
@@ -63,7 +63,7 @@ export const MainView: FC<MainViewProps> = props =>
             <NavigatorView />
             <InventoryView />
             <CatalogView />
-            <FriendListView />
+            <FriendsView />
             <RightSideView />
             <UserSettingsView />
             <UserProfileView />
diff --git a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss
index 8cffc632..1e671f8d 100644
--- a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss
+++ b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.scss
@@ -6,4 +6,8 @@
         height: 79px;
         background: url(../../../../../assets/images/room-widgets/dimmer-widget/dimmer_banner.png) center no-repeat;
     }
+
+    .color-swatch {
+        height: 30px;
+    }
 }
diff --git a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx
index 18cd0bcf..42b9d2ab 100644
--- a/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx
+++ b/src/views/room/widgets/furniture/dimmer/FurnitureDimmerView.tsx
@@ -1,7 +1,7 @@
 import { NitroEvent, RoomEngineTriggerWidgetEvent } from '@nitrots/nitro-renderer';
 import { FC, useCallback, useEffect, useMemo, useState } from 'react';
 import ReactSlider from 'react-slider';
-import { GetRoomEngine, LocalizeText, RoomWidgetDimmerPreviewMessage, RoomWidgetDimmerSavePresetMessage, RoomWidgetDimmerUpdateEvent, RoomWidgetFurniToWidgetMessage, RoomWidgetRoomObjectUpdateEvent } from '../../../../../api';
+import { GetConfiguration, GetRoomEngine, LocalizeText, RoomWidgetDimmerPreviewMessage, RoomWidgetDimmerSavePresetMessage, RoomWidgetDimmerUpdateEvent, RoomWidgetFurniToWidgetMessage, RoomWidgetRoomObjectUpdateEvent } from '../../../../../api';
 import { RoomDimmerPreset } from '../../../../../api/nitro/room/widgets/events/RoomDimmerPreset';
 import { RoomWidgetDimmerStateUpdateEvent } from '../../../../../api/nitro/room/widgets/events/RoomWidgetDimmerStateUpdateEvent';
 import { RoomWidgetDimmerChangeStateMessage } from '../../../../../api/nitro/room/widgets/messages/RoomWidgetDimmerChangeStateMessage';
@@ -10,12 +10,15 @@ import { NitroCardContentView, NitroCardHeaderView, NitroCardTabsItemView, Nitro
 import { useRoomContext } from '../../../context/RoomContext';
 import { FurnitureDimmerData } from './FurnitureDimmerData';
 
+const DEFAULT_COLORS: string[] = ['#74F5F5', '#0053F7', '#E759DE', '#EA4532', '#F2F851', '#82F349', '#000000'];
+
 export const FurnitureDimmerView: FC<{}> = props =>
 {
     const { eventDispatcher = null, widgetHandler = null } = useRoomContext();
     const [ dimmerData, setDimmerData ] = useState<FurnitureDimmerData>(null);
 
     const [ isActive, setIsActive ] = useState<boolean>(false);
+    const [ isFreeColorMode, setIsFreeColorMode ] = useState<boolean>(false);
     const [ selectedPresetId, setSelectedPresetId ] = useState<number>(-1);
     const [ presets, setPresets ] = useState<RoomDimmerPreset[]>([]);
 
@@ -28,6 +31,11 @@ export const FurnitureDimmerView: FC<{}> = props =>
         return parseInt(previewColor.replace('#', ''), 16);
     }, [ previewColor ]);
 
+    useEffect(() =>
+    {
+        if(GetConfiguration<boolean>('widget.dimmer.colorwheel')) setIsFreeColorMode(true);
+    }, []);
+
     useEffect(() =>
     {
         if(selectedPresetId === -1 || presets.length === 0 || !isActive) return;
@@ -132,7 +140,14 @@ export const FurnitureDimmerView: FC<{}> = props =>
                     <div className="p-2">
                         <div className="form-group mb-2">
                             <label className="fw-bold text-black">{ LocalizeText('widget.backgroundcolor.hue') }</label>
-                            <input type="color" className="form-control" value={ previewColor } onChange={ (e) => setPreviewColor(e.target.value) } />
+                            { isFreeColorMode && <input type="color" className="form-control" value={ previewColor } onChange={ (e) => setPreviewColor(e.target.value) } /> }
+                            { !isFreeColorMode && <div className="d-flex gap-2">
+                                { DEFAULT_COLORS.map((color, index) =>
+                                {
+                                    return <div key={ index } className="rounded w-100 color-swatch cursor-pointer" onClick={ () => setPreviewColor(color) } style={{ backgroundColor: color }}></div>;
+                                }) }
+                            </div> }
+                            
                         </div>
                         <div className="form-group mb-2">
                             <label className="fw-bold text-black">{ LocalizeText('widget.backgroundcolor.lightness') }</label>