fix: fix two button display issues

client/containers/App/Breadcrumbs/Breadcrumbs.tsx

@@ -28,10 +28,6 @@ const Breadcrumbs = (props: Props) => {
 	const [newCollectionIsOpen, setNewCollectionIsOpen] = useState(false);
 	const createPubAltchaRef = useRef<import('components').AltchaRef>(null);
 
-	// console.log(locationData.path.split('/'), locationData.path.split('/').slice(-1))
-	// const modesWithSubmodes = ['discussions', 'reviews', 'pages'];
-	// const isParentMode = modesWithSubmodes.includes(activeMode);
-
 	let title = communityData.title;
 	let avatar = communityData.avatar;
 	let showLockIcon = false;

client/containers/App/Breadcrumbs/breadcrumbs.scss

@@ -74,6 +74,8 @@ $bp: vendor.$bp-namespace;
 		}
 	}
 	.breadcrumb-actions {
+		display: flex;
+		align-items: center;
 		flex: 0 0 auto;
 		.#{$bp}-button {
 			margin-left: 15px;

package.json

@@ -116,7 +116,6 @@
 		"@types/react-dom": "^17.0.9",
 		"@types/styled-components": "^5.1.12",
 		"@types/website-scraper": "^1.2.10",
-
 		"altcha": "^2.3.0",
 		"altcha-lib": "^1.4.0",
 		"amqplib": "^0.10.9",
@@ -125,7 +124,6 @@
 		"busboy": "^1.6.0",
 		"camelcase-css": "^2.0.1",
 		"cheerio": "1.0.0-rc.12",
-
 		"citation-js": "^0.6.3",
 		"classnames": "^2.2.6",
 		"color": "^3.1.1",
@@ -369,6 +367,9 @@
 			"nodemon",
 			"protobufjs",
 			"validate-with-xmllint"
-		]
+		],
+		"patchedDependencies": {
+			"reakit": "patches/reakit.patch"
+		}
 	}
 }

patches/reakit.patch

@@ -0,0 +1,61 @@
+diff --git a/es/Portal/Portal.js b/es/Portal/Portal.js
+index 25d75dface672490a05ec1e5913edb84f5e07430..312cbbbfcfa70c8cecbbe83252675a7be4fbf1c5 100644
+--- a/es/Portal/Portal.js
++++ b/es/Portal/Portal.js
+@@ -13,17 +13,17 @@ function Portal(_ref) {
+   // https://github.com/reakit/reakit/issues/513
+   var context = useContext(PortalContext) || getBodyElement();
+
+-  var _React$useState = useState(function () {
+-    if (typeof document !== "undefined") {
++  var _React$useState = useState(null),
++      portal = _React$useState[0],
++      setPortal = _React$useState[1];
++
++  useEffect(function () {
++    if (typeof document !== "undefined" && !portal) {
+       var element = document.createElement("div");
+       element.className = Portal.__className;
+-      return element;
+-    } // ssr
+-
+-
+-    return null;
+-  }),
+-      portal = _React$useState[0];
++      setPortal(element);
++    }
++  }, []);
+
+   useEffect(function () {
+     if (!portal || !context) return undefined;
+diff --git a/lib/Portal/Portal.js b/lib/Portal/Portal.js
+index 6fe994a69f5abe35f02a5c9db55a6f9d81405d59..7d6502194a82fb31e30b7076bb844fbea6fc0a2d 100644
+--- a/lib/Portal/Portal.js
++++ b/lib/Portal/Portal.js
+@@ -17,17 +17,16 @@ function Portal(_ref) {
+   // https://github.com/reakit/reakit/issues/513
+   var context = React.useContext(PortalContext) || getBodyElement();
+
+-  var _React$useState = React.useState(function () {
+-    if (typeof document !== "undefined") {
++  var _React$useState = React.useState(null),
++      portal = _React$useState[0],
++      setPortal = _React$useState[1];
++  React.useEffect(function () {
++    if (typeof document !== "undefined" && !portal) {
+       var element = document.createElement("div");
+       element.className = Portal.__className;
+-      return element;
+-    } // ssr
+-
+-
+-    return null;
+-  }),
+-      portal = _React$useState[0];
++      setPortal(element);
++    }
++  }, []);
+
+   React.useEffect(function () {
+     if (!portal || !context) return undefined;

server/routes/pubDocument.tsx

@@ -142,7 +142,6 @@ const getEnrichedPubData = async (options: EnrichedPubOptions) => {
 		collectionPub.collectionId.startsWith(initialData.locationData.query.readingCollection),
 	);
 
-	console.time('Promise.all: docInfo, edges, subscription, nextCollectionPub');
 	const [docInfo, edges, subscription, nextCollectionPub] = await Promise.all([
 		log('getDocInfo', getDocInfo()),
 		log('getPubEdges', getPubEdges(pubData, initialData)),