🆕 Added Username to Chooser (upon request)

src/api/room/widgets/RoomObjectItem.ts

@@ -3,26 +3,41 @@ export class RoomObjectItem
     private _id: number;
     private _category: number;
     private _name: string;
+    private _ownerId: number;
+    private _ownerName: string;
+    private _type?: string;
 
-    constructor(id: number, category: number, name: string)
+    constructor( id: number, category: number, name: string, ownerId: number = 0, ownerName: string = '#', type?: string )
     {
         this._id = id;
         this._category = category;
         this._name = name;
+        this._ownerId = ownerId;
+        this._ownerName = ownerName;
+        this._type = type;
     }
 
-    public get id(): number
+    public get id(): number { 
-    {
 		return this._id;
 	}
 	
-    public get category(): number
+    public get category(): number {
-    {
 		return this._category;
 	}
     
-    public get name(): string
+	public get name(): string {
-    {
 		return this._name;
 	}
+    
+	public get ownerId(): number {
+		return this._ownerId;
+	}
+    
+	public get ownerName(): string {
+		return this._ownerName ?? '#';
+	}
+    
+	public get type(): string {
+		return this._type ?? '-';
+	}
 }

src/components/room/widgets/choosers/ChooserWidgetView.scss

@@ -1,4 +1,4 @@
 .nitro-chooser-widget {
-    width: $nitro-chooser-width;
+    width: 420px;
-    height: $nitro-chooser-height;
+    height: 400px;
 }

src/components/room/widgets/choosers/ChooserWidgetView.tsx

@@ -16,7 +16,7 @@ interface ChooserWidgetViewProps
 
 export const ChooserWidgetView: FC<ChooserWidgetViewProps> = props =>
 {
-    const { title = null, items = [], selectItem = null, onClose = null } = props;
+    const { title = null, items = [], selectItem = null, onClose = null, pickallFurni = false } = props;
     const [ selectedItem, setSelectedItem ] = useState<RoomObjectItem>(null);
     const [ searchValue, setSearchValue ] = useState('');
     const canSeeId = GetSessionDataManager().isModerator;
@@ -24,6 +24,22 @@ export const ChooserWidgetView: FC<ChooserWidgetViewProps> = props =>
     const [ checkAll, setCheckAll ] = useState(false);
     const [ checkedIds, setCheckedIds ] = useState<number[]>([]);
 
+    const ownerNames = useMemo(() => {
+        const names = Array.from(new Set(items.map(item => item.ownerName || 'Unknown')));
+        return names.sort();
+    }, [items]);
+
+    const [ selectedFilter, setSelectedFilter ] = useState(() => {
+        if (pickallFurni) return 'all';
+        return ownerNames.length > 0 ? ownerNames[0] : '';
+    });
+
+    useEffect(() => {
+        if (!pickallFurni && ownerNames.length > 0 && !selectedFilter) {
+            setSelectedFilter(ownerNames[0]);
+        }
+    }, [pickallFurni, ownerNames, selectedFilter]);
+
     const checkedId = (id?: number) =>
     {
         if (id) 
@@ -62,12 +78,15 @@ export const ChooserWidgetView: FC<ChooserWidgetViewProps> = props =>
     {
         const value = searchValue.toLocaleLowerCase();
 
-        const itemsFilter = items.filter(item => item.name?.toLocaleLowerCase().includes(value));
+        return items
-
+            .filter(item => 
-        const itemsFilterSorted = itemsFilter.sort((a, b) => a.name.localeCompare(b.name));
+            {
-
+                const matchesSearch = item.name?.toLocaleLowerCase().includes(value);
-        return itemsFilterSorted
+                const matchesFilter = !pickallFurni ? (selectedFilter ? item.ownerName === selectedFilter : true) : (selectedFilter === 'all' || item.ownerName === selectedFilter);
-    }, [ items, searchValue ]);
+                return matchesSearch && matchesFilter;
+            })
+            .sort((a, b) => a.name.localeCompare(b.name));
+    }, [ items, searchValue, selectedFilter, pickallFurni ]);
 
     useEffect(() =>
     {
@@ -80,21 +99,65 @@ export const ChooserWidgetView: FC<ChooserWidgetViewProps> = props =>
         <NitroCardView className="nitro-chooser-widget" theme="primary-slim">
             <NitroCardHeaderView headerText={ title + ' (' + filteredItems.length + ')' } onCloseClick={ onClose } />
             <NitroCardContentView overflow="hidden" gap={ 1 }>
-                <input type="text" className="form-control form-control-sm" placeholder={ LocalizeText('generic.search') } value={ searchValue } onChange={ event => setSearchValue(event.target.value) } />
+                <Flex gap={ 2 }>
-                { props.pickallFurni && <Flex gap={ 2 } className="text-black">
+                    <input 
-                    <input className="form-check-input" type="checkbox" checked={ checkAll } onChange={ (e) => checkedId() } />
+                        type="text" 
+                        className="form-control form-control-sm" 
+                        placeholder={ LocalizeText('generic.search') } 
+                        value={ searchValue } 
+                        onChange={ event => setSearchValue(event.target.value) } 
+                    />
+                    { pickallFurni && (
+                        <select
+                            className="form-control form-control-sm"
+                            value={ selectedFilter }
+                            onChange={ event => setSelectedFilter(event.target.value) }
+                        >
+                            <option value="all">{ LocalizeText('roomsettings.access_rights.anyone') }</option>
+                            { ownerNames.length > 0 ? (
+                                ownerNames.map((value, index) => (
+                                    <option key={ index } value={ value }>{ value }</option>
+                                ))
+                            ) : (
+                                <option disabled>No owners found</option>
+                            )}
+                        </select>
+                    )}
+                </Flex>
+                { pickallFurni && <Flex gap={ 2 } className="text-black">
+                    <input className="form-check-input" type="checkbox" checked={ checkAll } onChange={ () => checkedId() } />
                     <label className="form-check-label">{ LocalizeText('widget.chooser.checkall') }</label>
                 </Flex> }
-                <InfiniteScroll rows={ filteredItems } rowRender={ row =>
+                <InfiniteScroll 
+                    rows={ filteredItems } 
+                    rowRender={ row =>
                     {
                         return (
-                        <Flex alignItems="center" className={ classNames('rounded p-1', (selectedItem === row) && 'bg-muted') } pointer onClick={ event => setSelectedItem(row) }>
+                            <Flex 
-                            { props.pickallFurni && <input className="flex-shrink-0 mx-1 form-check-input" type="checkbox" name="showMyFace" checked={ isChecked(row.id) } onChange={ (e) => checkedId(row.id) } /> }
+                                alignItems="center" 
-                            <Text truncate>{ row.name } { canSeeId && (' - ' + row.id) }</Text>
+                                className={ classNames('rounded p-1', (selectedItem === row) && 'bg-muted') } 
+                                pointer 
+                                onClick={ event => setSelectedItem(row) }
+                            >
+                                { pickallFurni && <input 
+                                    className="flex-shrink-0 mx-1 form-check-input" 
+                                    type="checkbox" 
+                                    checked={ isChecked(row.id) } 
+                                    onChange={ () => checkedId(row.id) } 
+                                /> }
+                                <Text truncate>
+                                    { row.name } { canSeeId && (' - ' + row.id) } 
+                                    { row.ownerName && row.ownerName !== '-' && ` (Owner: ${row.ownerName})` }
+                                </Text>
                             </Flex>
                         );
-                } } />
+                    } } 
-                { props.pickallFurni && <Button variant="secondary" onClick={ event => onClickPickAll() } disabled={ !checkedIds.length }>
+                />
+                { pickallFurni && <Button 
+                    variant="secondary" 
+                    onClick={ onClickPickAll } 
+                    disabled={ !checkedIds.length }
+                >
                     { LocalizeText('widget.chooser.btn.pickall') }
                 </Button> }
             </NitroCardContentView>

src/hooks/rooms/widgets/useFurniChooserWidget.ts

@@ -37,8 +37,13 @@ const useFurniChooserWidgetState = () =>
                 if(furniData && furniData.name.length) name = furniData.name;
             }
 
-            return new RoomObjectItem(roomObject.id, RoomObjectCategory.WALL, name);
+            const ownerId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_OWNER_ID) || 0;
-        });
+            const ownerName = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_OWNER_NAME) || 
+                             (sessionDataManager.getUserData ? sessionDataManager.getUserData(ownerId)?.name : null) || 
+                             `User_${ownerId}`;
+
+            return new RoomObjectItem(roomObject.id, RoomObjectCategory.WALL, name, ownerId, ownerName);
+        }).filter(item => item !== null);
 
         const floorItems = floorObjects.map(roomObject =>
         {
@@ -51,8 +56,13 @@ const useFurniChooserWidgetState = () =>
 
             if(furniData && furniData.name.length) name = furniData.name;
 
-            return new RoomObjectItem(roomObject.id, RoomObjectCategory.FLOOR, name);
+            const ownerId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_OWNER_ID) || 0;
-        });
+            const ownerName = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_OWNER_NAME) || 
+                             (sessionDataManager.getUserData ? sessionDataManager.getUserData(ownerId)?.name : null) || 
+                             `User_${ownerId}`;
+
+            return new RoomObjectItem(roomObject.id, RoomObjectCategory.FLOOR, name, ownerId, ownerName);
+        }).filter(item => item !== null);
 
         setItems([ ...wallItems, ...floorItems ].sort((a, b) => ((a.name < b.name) ? -1 : 1)));
     }
@@ -84,7 +94,12 @@ const useFurniChooserWidgetState = () =>
                     if(furniData && furniData.name.length) name = furniData.name;
                 }
 
-                item = new RoomObjectItem(roomObject.id, RoomObjectCategory.WALL, name);
+                const ownerId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_OWNER_ID) || 0;
+                const ownerName = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_OWNER_NAME) || 
+                                 (GetSessionDataManager().getUserData ? GetSessionDataManager().getUserData(ownerId)?.name : null) || 
+                                 `User_${ownerId}`;
+
+                item = new RoomObjectItem(roomObject.id, RoomObjectCategory.WALL, name, ownerId, ownerName);
 
                 break;
             }
@@ -96,11 +111,16 @@ const useFurniChooserWidgetState = () =>
 
                 if(furniData && furniData.name.length) name = furniData.name;
 
-                item = new RoomObjectItem(roomObject.id, RoomObjectCategory.FLOOR, name);
+                const ownerId = roomObject.model.getValue<number>(RoomObjectVariable.FURNITURE_OWNER_ID) || 0;
+                const ownerName = roomObject.model.getValue<string>(RoomObjectVariable.FURNITURE_OWNER_NAME) || 
+                                 (GetSessionDataManager().getUserData ? GetSessionDataManager().getUserData(ownerId)?.name : null) || 
+                                 `User_${ownerId}`;
+
+                item = new RoomObjectItem(roomObject.id, RoomObjectCategory.FLOOR, name, ownerId, ownerName);
             }
         }
 
-        setItems(prevValue => [ ...prevValue, item ].sort((a, b) => ((a.name < b.name) ? -1 : 1)));
+        if(item) setItems(prevValue => [ ...prevValue, item ].sort((a, b) => ((a.name < b.name) ? -1 : 1)));
     });
 
     useFurniRemovedEvent(!!items, event =>