feat: add new theme berry (#860)

* feat: add theme berry

* docs: add development notes

* fix: fix blank page

* chore: update implementation

* fix: fix package.json

* chore: update ui copy

---------

Co-authored-by: JustSong <songquanpeng@foxmail.com>

web/berry/src/views/Channel/component/GroupLabel.js

@@ -0,0 +1,27 @@
+import PropTypes from "prop-types";
+import Label from "ui-component/Label";
+import Stack from "@mui/material/Stack";
+import Divider from "@mui/material/Divider";
+
+const GroupLabel = ({ group }) => {
+  let groups = [];
+  if (group === "") {
+    groups = ["default"];
+  } else {
+    groups = group.split(",");
+    groups.sort();
+  }
+  return (
+    <Stack divider={<Divider orientation="vertical" flexItem />} spacing={0.5}>
+      {groups.map((group, index) => {
+        return <Label key={index}>{group}</Label>;
+      })}
+    </Stack>
+  );
+};
+
+GroupLabel.propTypes = {
+  group: PropTypes.string,
+};
+
+export default GroupLabel;