updated MenuWithLinks #156 (in progress)

async-labs · May 17, 2021 · 72f1d36 · 72f1d36
1 parent 5acfe86
commit 72f1d36
Show file tree

Hide file tree

Showing 3 changed files with 29 additions and 22 deletions.
diff --git a/saas/app/components/common/MenuWithLinks.tsx b/saas/app/components/common/MenuWithLinks.tsx
@@ -1,7 +1,7 @@
 import Menu from '@material-ui/core/Menu';
 import MenuItem from '@material-ui/core/MenuItem';
+import Link from 'next/link';
 import { NextRouter, withRouter } from 'next/router';
-import Router from 'next/router';
 import React from 'react';
 
 class MenuWithLinks extends React.PureComponent<{
@@ -37,25 +37,30 @@ class MenuWithLinks extends React.PureComponent<{
  >
  {options.map((option, i) =>
  option.separator ? (
- <hr style={{ width: '85%', margin: '10px auto' }} key={`separated-${i}`} />
- ) : (
+ <hr style={{ width: '95%', margin: '10px auto' }} key={`separated-${i}`} />
+ ) : option.externalServer ? (
  <MenuItem
- onClick={() => {
- if (option.externalServer) {
- window.location.href = option.href;
- } else {
- Router.push(option.href, option.as || option.href);
- }
+ onClick={(event) => {
+ event.preventDefault();
+ window.location.href = option.href;
  this.handleClose();
  }}
- key={option.href}
- style={{
- fontWeight: router.asPath.includes(option.highlighterSlug) ? 600 : 300,
- fontSize: '14px',
- }}
+ key={option.href || option.text}
  >
  {option.text}
  </MenuItem>
+ ) : (
+ <Link key={option.href} href={option.href} as={option.as} passHref>
+ <MenuItem
+ key={option.href}
+ style={{
+ fontWeight: router.asPath.includes(option.highlighterSlug) ? 600 : 300,
+ fontSize: '14px',
+ }}
+ >
+ {option.text}
+ </MenuItem>
+ </Link>
  ),
  )}
  </Menu>

diff --git a/saas/app/components/layout/index.tsx b/saas/app/components/layout/index.tsx
@@ -93,23 +93,26 @@ function LayoutWrapper({
  </svg>
  <MenuWithLinks
  options={[
+ {
+ text: 'Your Settings',
+ href: '/your-settings',
+ highlighterSlug: '/your-settings',
+ },
  {
  text: 'Team Settings',
  href: `/team-settings?teamSlug=${store.currentTeam.slug}`,
  as: `/team/${store.currentTeam.slug}/team-settings`,
  simple: true,
+ highlighterSlug: '/team-settings',
  },
  {
  text: 'Billing',
  href: `/billing?teamSlug=${store.currentTeam.slug}`,
  as: `/team/${store.currentTeam.slug}/billing`,
  simple: true,
+ highlighterSlug: '/billing',
  },
- {
- text: 'Your Settings',
- href: '/your-settings',
- highlighterSlug: '/your-settings',
- },
+
  {
  separator: true,
  },

diff --git a/saas/app/components/posts/PostEditor.tsx b/saas/app/components/posts/PostEditor.tsx
@@ -60,7 +60,7 @@ class PostEditor extends React.Component<Props, State> {
  const membersMinusCurrentUser = members.filter((member) => member._id !== currentUser._id);
 
  const isThemeDark = store && store.currentUser && store.currentUser.darkTheme === true;
- const textareaBackgroundColor = isThemeDark ? '#303030' : '#fff';
+ const textareaBackgroundColor = isThemeDark ? '#0d1117' : '#fff';
 
  return (
  <div style={{ marginTop: '20px' }}>
@@ -102,7 +102,7 @@ class PostEditor extends React.Component<Props, State> {
  <div
  style={{
  width: '100%',
- height: '100vh',
+ height: '100%',
  padding: '10px 15px',
  border: isThemeDark
  ? '1px solid rgba(255, 255, 255, 0.5)'
@@ -117,7 +117,6 @@ class PostEditor extends React.Component<Props, State> {
  input: {
  border: 'none',
  outline: 'none',
- font: '16px Roboto',
  color: isThemeDark ? '#fff' : '#000',
  fontWeight: 300,
  height: '100vh',