Merge Build & Manage tabs (#7217)

* The games you create are now accessible in one place only, simplifying the whole creation experience
* From the Create tab, you can now access the projects you're working on, as well as manage the games you have published

newIDE/app/src/AssetStore/AssetsHome.js

@@ -28,7 +28,7 @@ import {
 import { useDebounce } from '../Utils/UseDebounce';
 import PromotionsSlideshow from '../Promotions/PromotionsSlideshow';
 import { ColumnStackLayout } from '../UI/Layout';
-import { EarnBadges } from '../MainFrame/EditorContainers/HomePage/GetStartedSection/EarnBadges';
+import { EarnCredits } from '../MainFrame/EditorContainers/HomePage/GetStartedSection/EarnCredits';
 
 const cellSpacing = 2;
 
@@ -403,7 +403,7 @@ export const AssetsHome = React.forwardRef<Props, AssetsHomeInterface>(
 
             <PromotionsSlideshow />
             {onOpenProfile && (
-              <EarnBadges
+              <EarnCredits
                 achievements={achievements}
                 badges={badges}
                 onOpenProfile={onOpenProfile}

newIDE/app/src/AssetStore/ExampleStore/index.js

@@ -18,6 +18,7 @@ import GridList from '@material-ui/core/GridList';
 import { getExampleAndTemplateTiles } from '../../MainFrame/EditorContainers/HomePage/CreateSection/utils';
 import BackgroundText from '../../UI/BackgroundText';
 import { ColumnStackLayout } from '../../UI/Layout';
+import { isStartingPointExampleShortHeader } from '../../ProjectCreation/EmptyAndStartingPointProjects';
 
 const styles = {
   grid: {
@@ -39,25 +40,41 @@ const gameFilter = (
   return true;
 };
 
+const noStartingPointFilter = (
+  item: PrivateGameTemplateListingData | ExampleShortHeader
+) => {
+  if (item.previewImageUrls) {
+    // It's an example, filter out the starting points.
+    return !isStartingPointExampleShortHeader(item);
+  }
+
+  // It's a game template, always show.
+  return true;
+};
+
 type Props = {|
   onSelectExampleShortHeader: ExampleShortHeader => void,
   onSelectPrivateGameTemplateListingData: PrivateGameTemplateListingData => void,
   i18n: I18nType,
   onlyShowGames?: boolean,
+  hideStartingPoints?: boolean,
   columnsCount: number,
   rowToInsert?: {|
     row: number,
     element: React.Node,
   |},
+  hideSearch?: boolean,
 |};
 
 const ExampleStore = ({
   onSelectExampleShortHeader,
   onSelectPrivateGameTemplateListingData,
   i18n,
   onlyShowGames,
+  hideStartingPoints,
   columnsCount,
   rowToInsert,
+  hideSearch,
 }: Props) => {
   const { receivedGameTemplates } = React.useContext(AuthenticatedUserContext);
   const {
@@ -131,6 +148,11 @@ const ExampleStore = ({
                 privateGameTemplateListingData =>
                   !onlyShowGames || gameFilter(privateGameTemplateListingData)
               )
+              .filter(
+                privateGameTemplateListingData =>
+                  !hideStartingPoints ||
+                  noStartingPointFilter(privateGameTemplateListingData)
+              )
           : [],
         exampleShortHeaders: exampleShortHeadersSearchResults
           ? exampleShortHeadersSearchResults
@@ -139,6 +161,11 @@ const ExampleStore = ({
                 exampleShortHeader =>
                   !onlyShowGames || gameFilter(exampleShortHeader)
               )
+              .filter(
+                exampleShortHeader =>
+                  !hideStartingPoints ||
+                  noStartingPointFilter(exampleShortHeader)
+              )
           : [],
         onSelectPrivateGameTemplateListingData: privateGameTemplateListingData => {
           sendGameTemplateInformationOpened({
@@ -167,6 +194,7 @@ const ExampleStore = ({
       onSelectExampleShortHeader,
       i18n,
       onlyShowGames,
+      hideStartingPoints,
     ]
   );
 
@@ -183,15 +211,17 @@ const ExampleStore = ({
         numberOfTilesToDisplayUntilRowToInsert
       );
       return [
-        <GridList
-          cols={columnsCount}
-          style={styles.grid}
-          cellHeight="auto"
-          spacing={2}
-          key="first-tiles"
-        >
-          {firstTiles}
-        </GridList>,
+        firstTiles.length > 0 ? (
+          <GridList
+            cols={columnsCount}
+            style={styles.grid}
+            cellHeight="auto"
+            spacing={2}
+            key="first-tiles"
+          >
+            {firstTiles}
+          </GridList>
+        ) : null,
         rowToInsert ? (
           <Line key="inserted-row">{rowToInsert.element}</Line>
         ) : null,
@@ -214,17 +244,19 @@ const ExampleStore = ({
   return (
     <React.Fragment>
       <Column expand noMargin>
-        <Line>
-          <Column expand noMargin>
-            <SearchBar
-              value={localSearchText}
-              onChange={setSearchText}
-              onRequestSearch={() => {}}
-              ref={searchBarRef}
-              placeholder={t`Search examples`}
-            />
-          </Column>
-        </Line>
+        {!hideSearch && (
+          <Line>
+            <Column expand noMargin>
+              <SearchBar
+                value={localSearchText}
+                onChange={setSearchText}
+                onRequestSearch={() => {}}
+                ref={searchBarRef}
+                placeholder={t`Search examples`}
+              />
+            </Column>
+          </Line>
+        )}
         {resultTiles.length === 0 ? (
           <Column noMargin expand justifyContent="center">
             <Spacer />

newIDE/app/src/AssetStore/ShopTiles.js

@@ -112,7 +112,7 @@ const styles = {
   },
 };
 
-const useStylesForGridListItem = ({ disabled }: { disabled?: boolean }) =>
+const useStylesForGridListItem = ({ disabled }: {| disabled?: boolean |}) =>
   makeStyles(theme =>
     createStyles({
       tile: !disabled

newIDE/app/src/CommandPalette/CommandPalette/AutocompletePicker.js

@@ -55,7 +55,7 @@ type Item = NamedCommand | CommandOption | GoToWikiCommand;
 
 const HitPrimaryText = (
   hit: any,
-  { removeLastLevel }: { removeLastLevel: boolean }
+  { removeLastLevel }: {| removeLastLevel: boolean |}
 ) => {
   const classes = useStyles();
 

newIDE/app/src/Course/CoursePreviewBanner.js

@@ -45,7 +45,7 @@ const styles = {
   progress: { borderRadius: 4, height: 5 },
   chip: { height: 24 },
   gdevelopAvatar: { width: 20, height: 20 },
-  thumbnail: { borderRadius: 4 },
+  thumbnail: { borderRadius: 4, aspectRatio: '16 / 9' },
   statusContainer: {
     display: 'flex',
     alignItems: 'center',

newIDE/app/src/Debugger/Profiler/MeasuresTable.js

@@ -89,15 +89,19 @@ const MeasuresTable = (props: Props) => {
     });
   };
 
-  const rowClassName = ({ index }: { index: number }) => {
+  const rowClassName = ({ index }: {| index: number |}) => {
     if (index < 0) {
       return 'tableHeaderRow';
     } else {
       return index % 2 === 0 ? 'tableEvenRow' : 'tableOddRow';
     }
   };
 
-  const renderSectionNameCell = ({ rowData }: { rowData: ProfilerRowData }) => {
+  const renderSectionNameCell = ({
+    rowData,
+  }: {|
+    rowData: ProfilerRowData,
+  |}) => {
     return (
       <div style={styles.indent}>
         <div style={{ width: rowData.depth * 8 }} />

newIDE/app/src/EventsBasedBehaviorEditor/index.js

@@ -2,7 +2,6 @@
 import { Trans } from '@lingui/macro';
 import { t } from '@lingui/macro';
 import { I18n } from '@lingui/react';
-import { type I18n as I18nType } from '@lingui/core';
 
 import * as React from 'react';
 import TextField from '../UI/TextField';
@@ -67,7 +66,7 @@ export default function EventsBasedBehaviorEditor({
 
   return (
     <I18n>
-      {({ i18n }: { i18n: I18nType }) => (
+      {({ i18n }) => (
         <ColumnStackLayout expand noMargin>
           <DismissableAlertMessage
             identifier="events-based-behavior-explanation"

newIDE/app/src/EventsSheet/EventsTree/index.js

@@ -349,7 +349,7 @@ type EventsTreeProps = {|
 // event, except for the buttons at the bottom of the sheet and the tutorial.
 export type SortableTreeNode = {|
   // Necessary attributes for react-sortable-tree.
-  title: (node: { node: SortableTreeNode }) => Node,
+  title: (node: {| node: SortableTreeNode |}) => Node,
   children: Array<any>,
   expanded: boolean,
 
@@ -700,7 +700,7 @@ export default class ThemableEventsTree extends Component<
     }
   };
 
-  _onVisibilityToggle = ({ node }: { node: SortableTreeNode }) => {
+  _onVisibilityToggle = ({ node }: {| node: SortableTreeNode |}) => {
     const { event } = node;
     if (!event) return;
 
@@ -768,7 +768,7 @@ export default class ThemableEventsTree extends Component<
     this.forceEventsUpdate();
   };
 
-  _getRowHeight = ({ node }: { node: ?SortableTreeNode }) => {
+  _getRowHeight = ({ node }: {| node: ?SortableTreeNode |}) => {
     if (!node) return 0;
     if (!node.event) return node.fixedHeight || 0;
 
@@ -787,7 +787,7 @@ export default class ThemableEventsTree extends Component<
     }
   };
 
-  _renderEvent = ({ node }: { node: SortableTreeNode }) => {
+  _renderEvent = ({ node }: {| node: SortableTreeNode |}) => {
     const { event, depth, disabled } = node;
     if (!event) return null;
     const { DragSourceAndDropTarget, DropTarget } = this;

newIDE/app/src/ExportAndShare/Builds/BuildCard.js

@@ -96,7 +96,7 @@ const getIcon = (
   }
 };
 
-const BuildAndCreatedAt = ({ build }: { build: Build }) => (
+const BuildAndCreatedAt = ({ build }: {| build: Build |}) => (
   <Line alignItems="end">
     <Line noMargin alignItems="center">
       {getIcon(build.type)}

newIDE/app/src/ExportAndShare/ShareDialog/ExportLauncher.js

@@ -58,7 +58,7 @@ type Props = {|
   uiMode?: 'minimal',
 
   onExportLaunched?: () => void,
-  onExportSucceeded?: ({ build: ?Build }) => Promise<void>,
+  onExportSucceeded?: ({| build: ?Build |}) => Promise<void>,
   onExportErrored?: () => void,
 |};
 

newIDE/app/src/ExportAndShare/ShareDialog/PublishHome.js

@@ -73,7 +73,7 @@ const styles = {
   },
 };
 
-const getSectionLabel = ({ section }: { section: ExporterSection }) => {
+const getSectionLabel = ({ section }: {| section: ExporterSection |}) => {
   switch (section) {
     case 'browser':
       return <Trans>Browser</Trans>;

newIDE/app/src/GameDashboard/Feedbacks/GameFeedback.js

@@ -71,7 +71,7 @@ const pushOrCreateKey = (
 const groupFeedbacks = (
   i18n: I18nType,
   feedbacks: Array<Comment>,
-  { build, date }: { build: boolean, date: boolean }
+  { build, date }: {| build: boolean, date: boolean |}
 ): { [buildIdOrDate: string]: Array<Comment> } => {
   const feedbacksByBuild = feedbacks.reduce((acc, feedback) => {
     if (build) {

newIDE/app/src/GameDashboard/GameAnalyticsCharts.js

@@ -75,7 +75,7 @@ const CustomTooltip = ({
                 name,
                 unit,
                 value,
-              }: { name: string, unit: ?string, value: number },
+              }: {| name: string, unit: ?string, value: number |},
               index
             ) => (
               <Text noMargin key={index}>{`${name}: ${