Syncing files from cloud/master to master

.codecov.yml

@@ -10,7 +10,9 @@ coverage:
         project:
             default:
                 informational: true
-        patch: yes
+        patch:
+            front-end:
+              informational: true
         changes: no
 
 parsers:

.vscode/extensions.json

@@ -9,13 +9,14 @@
         "eamodio.gitlens",
         "firsttris.vscode-jest-runner",
         "ziyasal.vscode-open-in-github",
-        "felixfbecker.php-debug",
         "neilbrayfield.php-docblocker",
         "bmewburn.vscode-intelephense-client",
         "esbenp.prettier-vscode",
         "mblode.twig-language-2",
         "redhat.vscode-yaml",
-        "silvenon.mdx"
+        "silvenon.mdx",
+        "ikappas.phpcs",
+        "nhoizey.gremlins"
     ],
     // List of extensions recommended by VS Code that should not be recommended for users of this workspace.
     "unwantedRecommendations": []

applications/dashboard/controllers/api/LayoutsApiController.php

@@ -1,7 +1,7 @@
 <?php
 /**
  * @author Dan Redman <[email protected]>
- * @copyright 2009-2021 Higher Logic LLC.
+ * @copyright 2009-2022 Higher Logic LLC.
  * @license GPL-2.0-only
  */
 
@@ -21,8 +21,9 @@
 use Vanilla\Layout\Providers\MutableLayoutProviderInterface;
 use Vanilla\Layout\Resolvers\ReactResolver;
 use Vanilla\Layout\Section\AbstractLayoutSection;
+use Vanilla\Site\SiteSectionModel;
+use Vanilla\Subcommunities\Models\SubcommunitySiteSection;
 use Vanilla\Utility\SchemaUtils;
-use Vanilla\Web\CacheControlConstantsInterface;
 use Vanilla\Widgets\React\ReactWidgetInterface;
 
 /**
@@ -378,14 +379,22 @@ public function get_lookupHydrate(array $query = []): Data {
 
         $in = $this->schema([
             'layoutViewType:s',
-            'recordID:i',
+            'recordID:s',
             'recordType:s',
             'params:o?',
         ], 'in');
-        $parsedQuery = $in->validate($query);
-        $layoutID = $this->layoutViewModel->getLayoutIdLookup($parsedQuery['layoutViewType'], $parsedQuery['recordType'], $parsedQuery['recordID']);
+        $query = $in->validate($query);
+
+        [$layoutViewType, $recordType, $recordID] = $this->layoutViewModel->getProviderLayoutIdLookupParams(
+            $query['layoutViewType'],
+            $query['recordType'],
+            $query['recordID']
+        );
+
+        $layoutID = $this->layoutViewModel->getLayoutIdLookup($layoutViewType, $recordType, $recordID);
+
         if ($layoutID === '') {
-            $fileLayoutView = $this->layoutHydrator->getLayoutViewType($parsedQuery['layoutViewType']);
+            $fileLayoutView = $this->layoutHydrator->getLayoutViewType($query['layoutViewType']);
             $layoutID = $fileLayoutView->getLayoutID();
         }
 

applications/dashboard/models/class.usermodel.php

@@ -4395,8 +4395,9 @@ public function validateUniqueFields($username, $email, $userID = '', $return =
         // Make sure the username & email aren't already being used
         if (c('Garden.Registration.NameUnique', true) && $username) {
             $where['Name'] = $username;
-            $testData = $this->getWhere($where);
-            if ($testData->numRows() > 0) {
+            $sql = $this->Database->createSql();
+            $testData = $sql->getWhere('User', $where, '', '', 1)->resultArray();
+            if (!empty($testData)) {
                 $result['Name'] = false;
                 $valid = false;
             }
@@ -4405,8 +4406,9 @@ public function validateUniqueFields($username, $email, $userID = '', $return =
 
         if (c('Garden.Registration.EmailUnique', true) && $email) {
             $where['Email'] = $email;
-            $testData = $this->getWhere($where);
-            if ($testData->numRows() > 0) {
+            $sql = $this->Database->createSql();
+            $testData = $sql->getWhere('User', $where, '', '', 1)->resultArray();
+            if (!empty($testData)) {
                 $result['Email'] = false;
                 $valid = false;
             }

applications/dashboard/openapi/layouts.yml

@@ -193,14 +193,12 @@ paths:
                   description: Type of layout.
                   schema:
                       type: string
-
                 - name: recordID
                   in: query
                   required: true
                   description: ID of the resource associated with this layout.
                   schema:
-                      type: integer
-
+                      type: string
                 - name: recordType
                   in: query
                   required: true

applications/dashboard/settings/class.hooks.php

@@ -1016,7 +1016,7 @@ public function siteNavModule_init_handler($sender) {
      */
     public function updateModel_afterStructure_handler($sender) {
         // Only setup default permissions if no role permissions are set.
-        $hasPermissions = Gdn::sql()->getWhere('Permission', ['RoleID >' => 0])->firstRow(DATASET_TYPE_ARRAY);
+        $hasPermissions = Gdn::sql()->getWhere('Permission', ['RoleID >' => 0], '', '', 1)->firstRow(DATASET_TYPE_ARRAY);
         if (!$hasPermissions) {
             PermissionModel::resetAllRoles();
         }

applications/dashboard/src/scripts/layout/editor/LayoutEditor.sections.tsx

@@ -11,13 +11,13 @@ import { LayoutEditorAddWidget } from "@dashboard/layout/editor/LayoutEditorAddW
 import { LayoutEditorPath } from "@dashboard/layout/editor/LayoutEditorContents";
 import { LayoutEditorSectionToolbar } from "@dashboard/layout/editor/LayoutEditorSectionToolbar";
 import { LayoutEditorSelectionMode } from "@dashboard/layout/editor/LayoutEditorSelection";
+import { LayoutSectionInfos } from "@dashboard/layout/editor/LayoutSectionInfos";
 import { IHydratedEditableWidgetProps, ILayoutEditorPath } from "@dashboard/layout/layoutSettings/LayoutSettings.types";
 import { cx } from "@emotion/css";
 import { SectionFullWidth } from "@library/layout/SectionFullWidth";
 import { SectionOneColumn } from "@library/layout/SectionOneColumn";
 import ThreeColumnSection from "@library/layout/ThreeColumnSection";
 import TwoColumnSection from "@library/layout/TwoColumnSection";
-import { TabHandler } from "@vanilla/dom-utils";
 import { useFocusOnActivate } from "@vanilla/react-utils";
 import React, { useDebugValue, useRef } from "react";
 
@@ -235,6 +235,9 @@ function SectionDecorationAbsolute(
         ...props.$editorPath,
         sectionIndex: props.$editorPath.sectionIndex - 1,
     });
+
+    const allowColumnInvert = LayoutSectionInfos[props.$hydrate].allowColumnInvert;
+
     let offset = -20;
     if (isFullWidth) {
         offset = 0;
@@ -255,7 +258,11 @@ function SectionDecorationAbsolute(
                 </div>
             )}
             {!props.skipAfter && isSelfSectionSelected && (
-                <LayoutEditorSectionToolbar path={props.$editorPath} offset={offset} />
+                <LayoutEditorSectionToolbar
+                    path={props.$editorPath}
+                    offset={offset}
+                    allowColumnInvert={allowColumnInvert}
+                />
             )}
         </>
     );

applications/dashboard/src/scripts/layout/editor/LayoutEditorContents.tsx

@@ -225,6 +225,20 @@ export class LayoutEditorContents {
         });
     };
 
+    /**
+     * Modify a section at the specified index.
+     *
+     * @param index The index to modify at.
+     *
+     * @returns A new editor contents instance.
+     */
+    public modifySection = (index: number, newSpec: IEditableLayoutWidget): LayoutEditorContents => {
+        return this.modifyLayout((draft) => {
+            draft[index] = newSpec;
+            return draft;
+        });
+    };
+
     /**
      * Internal utility for immutably modifying the edit spec and creating a new instance.
      *
@@ -350,29 +364,37 @@ export class LayoutEditorContents {
         }
 
         const sectionInfo = LayoutSectionInfos[section.$hydrate] ?? null;
+        // handles "isInverted" prop
+        if (sectionInfo && section.isInverted) {
+            return { ...sectionInfo, regionNames: sectionInfo.invertedRegionNames as string[] };
+        }
         return sectionInfo;
     };
 
     /**
-     * Make sure a path has a valid region.
+     * Return a valid path for the next section.
      */
-    public ensureValidRegion = (
+    public getValidPath = (
         path: ILayoutEditorWidgetPath,
         newSectionInfo: ILayoutSectionInfo,
+        fromPath: ILayoutEditorWidgetPath,
     ): ILayoutEditorWidgetPath => {
         const initialRegion = path.sectionRegion;
+
+        // if there's the same region exists on the next section, move into that
         if (newSectionInfo.regionNames.includes(initialRegion)) {
             return path;
         }
 
+        // if there's only one region to move to, move into that
         if (newSectionInfo.regionNames.length === 1) {
             return {
                 ...path,
                 sectionRegion: newSectionInfo.regionNames[0],
             };
         }
 
-        // We came from a main column.
+        // we came from a main region, so try moving into the same on the next section
         if (["children", "mainBottom", "middleBottom"].includes(initialRegion)) {
             if (newSectionInfo.regionNames.includes("mainBottom")) {
                 return {
@@ -388,6 +410,21 @@ export class LayoutEditorContents {
             }
         }
 
+        // we came from either a left or right region, so move using the region index
+        const fromSectionInfo = this.getSectionInfo(fromPath);
+        const fromRegionIndex = fromSectionInfo ? fromSectionInfo.regionNames.indexOf(initialRegion) : -1;
+        if (fromSectionInfo && fromRegionIndex > -1) {
+            // the index is at the last position but both sections have different regions length
+            // move into the last index of the next section
+            if (fromRegionIndex >= fromSectionInfo.regionNames.length - 1) {
+                return {
+                    ...path,
+                    sectionRegion: newSectionInfo.regionNames[newSectionInfo.regionNames.length - 1],
+                };
+            }
+        }
+
+        // fallback, just move into the first region on the next section
         return {
             ...path,
             sectionRegion: newSectionInfo.regionNames[0],

applications/dashboard/src/scripts/layout/editor/LayoutEditorPreviewData.tsx

@@ -4,6 +4,7 @@
  */
 
 import { IUserFragment } from "@library/@types/api/users";
+import { IHomeWidgetItemProps } from "@library/homeWidget/HomeWidgetItem";
 export class LayoutEditorPreviewData {
     /**
      * Return some basic static user data in userfragment format.
@@ -17,4 +18,45 @@ export class LayoutEditorPreviewData {
             dateLastActive: "2016-07-25 17:51:15",
         };
     }
+
+    /**
+     * Return some category data as an array.
+     */
+    public static categories(): IHomeWidgetItemProps[] {
+        return [
+            {
+                counts: [
+                    { count: 99000, labelCode: "Items" },
+                    { count: 99, labelCode: "Other Items" },
+                ],
+                description: "This content is generated by users on the site. You can’t update it here.",
+                iconUrl: undefined,
+                imageUrl: undefined,
+                name: "Title",
+                to: "#",
+            },
+            {
+                counts: [
+                    { count: 99000, labelCode: "Items" },
+                    { count: 99, labelCode: "Other Items" },
+                ],
+                description: "This content is generated by users on the site. You can’t update it here.",
+                iconUrl: undefined,
+                imageUrl: undefined,
+                name: "Title",
+                to: "#",
+            },
+            {
+                counts: [
+                    { count: 99000, labelCode: "Items" },
+                    { count: 99, labelCode: "Other Items" },
+                ],
+                description: "This content is generated by users on the site. You can’t update it here.",
+                iconUrl: undefined,
+                imageUrl: undefined,
+                name: "Title",
+                to: "#",
+            },
+        ];
+    }
 }

applications/dashboard/src/scripts/layout/editor/LayoutEditorSectionToolbar.tsx

@@ -7,7 +7,7 @@
 import { useLayoutEditor } from "@dashboard/layout/editor/LayoutEditor";
 import { layoutEditorClasses } from "@dashboard/layout/editor/LayoutEditor.classes";
 import { LayoutEditorSelectionMode } from "@dashboard/layout/editor/LayoutEditorSelection";
-import { ILayoutEditorPath } from "@dashboard/layout/layoutSettings/LayoutSettings.types";
+import { IEditableLayoutWidget, ILayoutEditorPath } from "@dashboard/layout/layoutSettings/LayoutSettings.types";
 import { EmbedButton } from "@library/embeddedContent/components/EmbedButton";
 import { globalVariables } from "@library/styles/globalStyleVars";
 import { EmbedMenu } from "@rich-editor/editor/pieces/EmbedMenu";
@@ -17,6 +17,7 @@ import React from "react";
 interface IProps {
     path: ILayoutEditorPath;
     offset?: number;
+    allowColumnInvert?: boolean;
 }
 
 export function LayoutEditorSectionToolbar(props: IProps) {
@@ -62,6 +63,21 @@ export function LayoutEditorSectionToolbar(props: IProps) {
             >
                 <Icon icon={"data-down"} />
             </EmbedButton>
+            {props.allowColumnInvert && (
+                <EmbedButton
+                    onClick={(e) => {
+                        e.preventDefault();
+                        e.stopPropagation();
+                        const section = editorContents.getSection(props.path);
+                        const isInverted = section?.isInverted ? !section.isInverted : true;
+                        const newSpec = { ...section, isInverted: isInverted } as IEditableLayoutWidget;
+                        editorContents.modifySection(props.path.sectionIndex, newSpec);
+                    }}
+                    ariaLabel={"Invert the secondary column alignment between left and right."}
+                >
+                    <Icon icon={"data-swap"} />
+                </EmbedButton>
+            )}
             <EmbedButton
                 onClick={() => {
                     editorContents.deleteSection(props.path.sectionIndex);

applications/dashboard/src/scripts/layout/editor/LayoutEditorSelection.spec.ts

@@ -174,13 +174,13 @@ describe("LayoutEditorSelection", () => {
         selection.moveSelectionInDirection(LayoutEditorDirection.LEFT);
         assertSelectAddButton(LayoutEditorPath.widget(4, "mainBottom", 1));
 
-        // We can move right into the right column.
+        // We can move right into the secondary column.
         selection.moveSelectionInDirection(LayoutEditorDirection.RIGHT);
-        assertSelectAddButton(LayoutEditorPath.widget(4, "rightBottom", 0));
+        assertSelectAddButton(LayoutEditorPath.widget(4, "secondaryBottom", 0));
 
         // Going right doesn't do anything.
         selection.moveSelectionInDirection(LayoutEditorDirection.RIGHT);
-        assertSelectAddButton(LayoutEditorPath.widget(4, "rightBottom", 0));
+        assertSelectAddButton(LayoutEditorPath.widget(4, "secondaryBottom", 0));
 
         // We can move down into the 3 column section.
         selection.moveSelectionInDirection(LayoutEditorDirection.DOWN);

applications/dashboard/src/scripts/layout/editor/LayoutEditorSelection.tsx

@@ -207,7 +207,7 @@ export class LayoutEditorSelection extends LayoutEditorSelectionState {
                         return null;
                     }
 
-                    newPath = contents.ensureValidRegion(newPath, nextSectionInfo);
+                    newPath = contents.getValidPath(newPath, nextSectionInfo, fromPath);
                     newPath.sectionRegionIndex = 0;
                 }
                 return newPath;
@@ -227,7 +227,7 @@ export class LayoutEditorSelection extends LayoutEditorSelectionState {
                         // There is no previous section.
                         return null;
                     }
-                    newPath = contents.ensureValidRegion(newPath, previousSectionInfo);
+                    newPath = contents.getValidPath(newPath, previousSectionInfo, fromPath);
 
                     let maxRegionIndex = treatAddAsWidget
                         ? contents.getMaxRegionIndex(newPath)

applications/dashboard/src/scripts/layout/editor/LayoutSectionInfos.ts

@@ -7,14 +7,22 @@
 export interface ILayoutSectionInfo {
     regionNames: string[];
     oneWidgetPerRegion: boolean;
+    allowColumnInvert: boolean;
+    invertedRegionNames?: string[];
 }
 
 export const LayoutSectionInfos: Record<string, ILayoutSectionInfo> = {
     "react.section.3-columns": {
         regionNames: ["leftBottom", "middleBottom", "rightBottom"],
         oneWidgetPerRegion: false,
+        allowColumnInvert: false,
     },
-    "react.section.2-columns": { regionNames: ["mainBottom", "rightBottom"], oneWidgetPerRegion: false },
-    "react.section.1-column": { regionNames: ["children"], oneWidgetPerRegion: false },
-    "react.section.full-width": { regionNames: ["children"], oneWidgetPerRegion: true },
+    "react.section.2-columns": {
+        regionNames: ["mainBottom", "secondaryBottom"],
+        oneWidgetPerRegion: false,
+        allowColumnInvert: true,
+        invertedRegionNames: ["secondaryBottom", "mainBottom"],
+    },
+    "react.section.1-column": { regionNames: ["children"], oneWidgetPerRegion: false, allowColumnInvert: false },
+    "react.section.full-width": { regionNames: ["children"], oneWidgetPerRegion: true, allowColumnInvert: false },
 };