NormalPage component w/ Collections refactor (#4873)

* Refactor search page, migrate to /discover/

* Add NormalPage component for common layouts, refactor Collections page as an example, misc ui pkg cleanup

* intl:extract

* lint

* lint

* remove old components

* Refactor search page, migrate to /discover/

* Add NormalPage component for common layouts, refactor Collections page as an example, misc ui pkg cleanup

* intl:extract

* lint

* lint

* remove old components

packages/ui/src/utils/common-messages.ts

@@ -437,6 +437,10 @@ export const commonProjectTypeCategoryMessages = defineMessages({
 		id: 'project-type.server.category',
 		defaultMessage: 'Servers',
 	},
+	project: {
+		id: 'project-type.project.category',
+		defaultMessage: 'Projects',
+	},
 })
 
 export const commonProjectTypeTitleMessages = defineMessages({
@@ -468,6 +472,10 @@ export const commonProjectTypeTitleMessages = defineMessages({
 		id: 'project-type.server.capital',
 		defaultMessage: '{count, plural, one {Server} other {Servers}}',
 	},
+	project: {
+		id: 'project-type.project.lowercase',
+		defaultMessage: '{count, plural, one {Project} other {Projects}}',
+	},
 })
 
 export const commonProjectTypeSentenceMessages = defineMessages({
@@ -499,6 +507,10 @@ export const commonProjectTypeSentenceMessages = defineMessages({
 		id: 'project-type.server.lowercase',
 		defaultMessage: '{count, plural, one {server} other {servers}}',
 	},
+	project: {
+		id: 'project-type.project.lowercase',
+		defaultMessage: '{count, plural, one {project} other {projects}}',
+	},
 })
 
 export const commonSettingsMessages = defineMessages({

packages/ui/src/utils/index.ts

@@ -3,3 +3,4 @@ export * from './game-modes'
 export * from './notices'
 export * from './savable'
 export * from './search'
+export * from './vue-children'

packages/ui/src/utils/vue-children.ts

@@ -0,0 +1,25 @@
+import { createTextVNode, isVNode, toDisplayString, type VNode } from 'vue'
+
+/**
+ * Checks whether a specific child is a VNode. If not, converts it to a display
+ * string and then creates text VNode for the result.
+ *
+ * @param child Child to normalize.
+ * @returns Either the original VNode or a text VNode containing child converted
+ * to a display string.
+ */
+function normalizeChild(child: unknown): VNode {
+	return isVNode(child) ? child : createTextVNode(toDisplayString(child))
+}
+
+/**
+ * Takes in an array of VNodes and other children. It then converts each child
+ * that is not already a VNode to a display string, and creates a text VNode for
+ * that string.
+ *
+ * @param children Children to normalize.
+ * @returns Children with all of non-VNodes converted to display strings.
+ */
+export function normalizeChildren(children: unknown | unknown[]): VNode[] {
+	return Array.isArray(children) ? children.map(normalizeChild) : [normalizeChild(children)]
+}