Fix searching in groups in newIDE

newIDE/app/src/ObjectsGroupsList/index.js

@@ -1,3 +1,4 @@
+// @flow
 import React, { Component } from 'react';
 import { AutoSizer, List } from 'react-virtualized';
 import Paper from 'material-ui/Paper';
@@ -12,6 +13,7 @@ import {
   enumerateObjectsAndGroups,
   filterGroupsList,
 } from '../ObjectsList/EnumerateObjects';
+import type { GroupWithContextList, GroupWithContext } from '../ObjectsList/EnumerateObjects';
 
 const listItemHeight = 48;
 const styles = {
@@ -41,7 +43,9 @@ const SortableAddGroupRow = SortableElement(props => {
   return <AddGroupRow {...props} />;
 });
 
-class GroupsList extends Component {
+class GroupsList extends Component<*,*> {
+  list: any;
+
   forceUpdateGrid() {
     if (this.list) this.list.forceUpdateGrid();
   }
@@ -102,24 +106,26 @@ class GroupsList extends Component {
 
 const SortableGroupsList = SortableContainer(GroupsList, { withRef: true });
 
-export default class GroupsListContainer extends React.Component {
+type StateType = {|
+  renamedGroupWithScope: ?GroupWithContext,
+  searchText: string,
+|};
+
+export default class GroupsListContainer extends React.Component<*, StateType> {
   static defaultProps = {
     onDeleteGroup: (groupWithScope, cb) => cb(true),
     onRenameGroup: (groupWithScope, newName, cb) => cb(true),
   };
 
-  constructor(props) {
-    super(props);
+  sortableList: any;
+  containerGroupsList: GroupWithContextList = [];
+  projectGroupsList: GroupWithContextList = [];
+  state: StateType = {
+    renamedGroupWithScope: null,
+    searchText: '',
+  };
 
-    this.containerGroupsList = [];
-    this.projectGroupsList = [];
-    this.state = {
-      renamedGroupWithScope: false,
-      searchText: '',
-    };
-  }
-
-  shouldComponentUpdate(nextProps, nextState) {
+  shouldComponentUpdate(nextProps: *, nextState: StateType) {
     // The component is costly to render, so avoid any re-rendering as much
     // as possible.
     // We make the assumption that no changes to groups list is made outside
@@ -154,7 +160,7 @@ export default class GroupsListContainer extends React.Component {
     this.forceUpdate();
   };
 
-  _onDelete = groupWithScope => {
+  _onDelete = (groupWithScope: GroupWithContext) => {
     const { group, global } = groupWithScope;
     const { project, objectsContainer } = this.props;
 
@@ -177,7 +183,7 @@ export default class GroupsListContainer extends React.Component {
     });
   };
 
-  _onEditName = groupWithScope => {
+  _onEditName = (groupWithScope: GroupWithContext) => {
     this.setState(
       {
         renamedGroupWithScope: groupWithScope,
@@ -186,7 +192,7 @@ export default class GroupsListContainer extends React.Component {
     );
   };
 
-  _onRename = (groupWithScope, newName) => {
+  _onRename = (groupWithScope: GroupWithContext, newName: string) => {
     const { group } = groupWithScope;
     const { project, objectsContainer } = this.props;
 
@@ -212,7 +218,7 @@ export default class GroupsListContainer extends React.Component {
     });
   };
 
-  _onMove = (oldIndex, newIndex) => {
+  _onMove = (oldIndex: number, newIndex: number) => {
     const { project, objectsContainer } = this.props;
 
     const isInGroupsList = oldIndex < this.containerGroupsList.length;
@@ -244,9 +250,9 @@ export default class GroupsListContainer extends React.Component {
     const { searchText } = this.state;
 
     const lists = enumerateObjectsAndGroups(project, objectsContainer);
-    this.containerGroupsList = filterGroupsList(lists.containerGroupsList);
-    this.projectGroupsList = filterGroupsList(lists.projectGroupsList);
-    const allGroupsList = filterGroupsList(lists.allGroupsList);
+    this.containerGroupsList = filterGroupsList(lists.containerGroupsList, searchText);
+    this.projectGroupsList = filterGroupsList(lists.projectGroupsList, searchText);
+    const allGroupsList = filterGroupsList(lists.allGroupsList, searchText);
     const fullList = allGroupsList.concat({
       key: 'add-groups-row',
       object: null,
@@ -290,7 +296,6 @@ export default class GroupsListContainer extends React.Component {
             this.setState({
               searchText: text,
             })}
-          style={styles.searchBar}
         />
       </Paper>
     );

newIDE/app/src/ObjectsList/EnumerateObjects.js

@@ -2,25 +2,29 @@
 import { mapFor } from '../Utils/MapFor';
 const gd = global.gd;
 
+//TODO: Object and Group should be moved to a common type definition file
+//for all GDevelop.js
 type Object = {
   getName: Function,
+  setName: Function,
 };
 type Group = {
   getName: Function,
+  setName: Function,
 };
 
-type ObjectWithContext = {|
+export type ObjectWithContext = {|
   object: Object,
   global: boolean,
 |};
 
-type GroupWithContext = {|
+export type GroupWithContext = {|
   group: Group,
   global: boolean,
 |};
 
-type ObjectWithContextList = Array<ObjectWithContext>;
-type GroupWithContextList = Array<GroupWithContext>;
+export type ObjectWithContextList = Array<ObjectWithContext>;
+export type GroupWithContextList = Array<GroupWithContext>;
 
 export const enumerateObjects = (
   project: any,

newIDE/app/src/ObjectsList/index.js

@@ -1,3 +1,4 @@
+// @flow
 import React, { Component } from 'react';
 import { AutoSizer, List } from 'react-virtualized';
 import { ListItem } from 'material-ui/List';
@@ -11,6 +12,7 @@ import { showWarningBox } from '../UI/Messages/MessageBox';
 import { makeAddItem } from '../UI/ListAddItem';
 import { SortableContainer, SortableElement } from 'react-sortable-hoc';
 import { enumerateObjects, filterObjectsList } from './EnumerateObjects';
+import type { ObjectWithContextList, ObjectWithContext } from '../ObjectsList/EnumerateObjects';
 
 const listItemHeight = 48;
 const styles = {
@@ -40,7 +42,9 @@ const SortableAddObjectRow = SortableElement(props => {
   return <AddObjectRow {...props} />;
 });
 
-class ObjectsList extends Component {
+class ObjectsList extends Component<*,*> {
+  list: any;
+
   forceUpdateGrid() {
     if (this.list) this.list.forceUpdateGrid();
   }
@@ -109,26 +113,30 @@ class ObjectsList extends Component {
 
 const SortableObjectsList = SortableContainer(ObjectsList, { withRef: true });
 
-export default class ObjectsListContainer extends React.Component {
+type StateType = {|
+  newObjectDialogOpen: boolean,
+  renamedObjectWithScope: ?ObjectWithContext,
+  variablesEditedObject: any,
+  searchText: string,
+|};
+
+export default class ObjectsListContainer extends React.Component<*, StateType> {
   static defaultProps = {
     onDeleteObject: (objectWithScope, cb) => cb(true),
     onRenameObject: (objectWithScope, newName, cb) => cb(true),
   };
 
-  constructor(props) {
-    super(props);
+  sortableList: any;
+  containerObjectsList: ObjectWithContextList = [];
+  projectObjectsList: ObjectWithContextList = [];
+  state: StateType = {
+    newObjectDialogOpen: false,
+    renamedObjectWithScope: null,
+    variablesEditedObject: null,
+    searchText: '',
+  };
 
-    this.containerObjectsList = [];
-    this.projectObjectsList = [];
-    this.state = {
-      newObjectDialogOpen: false,
-      renamedObjectWithScope: false,
-      variablesEditedObject: null,
-      searchText: '',
-    };
-  }
-
-  shouldComponentUpdate(nextProps, nextState) {
+  shouldComponentUpdate(nextProps: *, nextState: StateType) {
     // The component is costly to render, so avoid any re-rendering as much
     // as possible.
     // We make the assumption that no changes to objects list is made outside
@@ -156,7 +164,7 @@ export default class ObjectsListContainer extends React.Component {
     return false;
   }
 
-  addObject = objectType => {
+  addObject = (objectType: string) => {
     const { project, objectsContainer } = this.props;
 
     const name = newNameGenerator(
@@ -184,7 +192,7 @@ export default class ObjectsListContainer extends React.Component {
     );
   };
 
-  _onDelete = objectWithScope => {
+  _onDelete = (objectWithScope: ObjectWithContext) => {
     const { object, global } = objectWithScope;
     const { project, objectsContainer } = this.props;
 
@@ -207,7 +215,7 @@ export default class ObjectsListContainer extends React.Component {
     });
   };
 
-  _onEditName = objectWithScope => {
+  _onEditName = (objectWithScope: ?ObjectWithContext) => {
     this.setState(
       {
         renamedObjectWithScope: objectWithScope,
@@ -216,13 +224,13 @@ export default class ObjectsListContainer extends React.Component {
     );
   };
 
-  _onEditVariables = object => {
+  _onEditVariables = (object: any) => {
     this.setState({
       variablesEditedObject: object,
     });
   };
 
-  _onRename = (objectWithScope, newName) => {
+  _onRename = (objectWithScope: ObjectWithContext, newName: string) => {
     const { object } = objectWithScope;
     const { project, objectsContainer } = this.props;
 
@@ -248,7 +256,7 @@ export default class ObjectsListContainer extends React.Component {
     });
   };
 
-  _onMove = (oldIndex, newIndex) => {
+  _onMove = (oldIndex: number, newIndex: number) => {
     const { project, objectsContainer } = this.props;
 
     const isInContainerObjectsList =
@@ -332,7 +340,6 @@ export default class ObjectsListContainer extends React.Component {
             this.setState({
               searchText: text,
             })}
-          style={styles.searchBar}
         />
         {this.state.newObjectDialogOpen && (
           <NewObjectDialog