move account_css to account header component, fix css change on navig…

…ation

app/javascript/flavours/glitch/api_types/accounts.ts

@@ -44,4 +44,5 @@ export interface ApiAccountJSON {
   limited?: boolean;
   memorial?: boolean;
   hide_collections: boolean;
+  account_css?: string;
 }

app/javascript/flavours/glitch/features/account/components/header.jsx

@@ -3,8 +3,8 @@ import PropTypes from 'prop-types';
 import { defineMessages, injectIntl, FormattedMessage } from 'react-intl';
 
 import classNames from 'classnames';
-import { Helmet } from 'react-helmet';
-import { withRouter } from 'react-router-dom';
+import {Helmet} from 'react-helmet';
+import {withRouter} from 'react-router-dom';
 
 import ImmutablePropTypes from 'react-immutable-proptypes';
 import ImmutablePureComponent from 'react-immutable-pure-component';
@@ -405,6 +405,11 @@ class Header extends ImmutablePureComponent {
           <title>{titleFromAccount(account)}</title>
           <meta name='robots' content={(isLocal && isIndexable) ? 'all' : 'noindex'} />
           <link rel='canonical' href={account.get('url')} />
+          {account.account_css && (
+            <style id={"account-css"} nonce={document.querySelector('meta[name=style-nonce]').content}>
+              {account.account_css}
+            </style>
+          )}
         </Helmet>
       </div>
     );

app/javascript/flavours/glitch/models/account.ts

@@ -60,7 +60,43 @@ export interface AccountShape
 
 export type Account = RecordOf<AccountShape>;
 
-export const accountDefaultValues: AccountShape = {
+export const accountDefaultValues: {
+  note: string;
+  hidden: boolean;
+  bot: boolean;
+  roles: Immutable.List<AccountRole>;
+  moved: null;
+  indexable: boolean;
+  created_at: string;
+  header_static: string;
+  account_css: string;
+  hide_collections: boolean;
+  id: string;
+  memorial: boolean;
+  locked: boolean;
+  display_name_html: string;
+  group: boolean;
+  emojis: Immutable.List<CustomEmoji>;
+  noindex: boolean;
+  limited: boolean;
+  avatar: string;
+  display_name: string;
+  note_plain: string;
+  uri: string;
+  url: string;
+  suspended: boolean;
+  following_count: number;
+  discoverable: boolean;
+  last_status_at: string;
+  statuses_count: number;
+  followers_count: number;
+  note_emojified: string;
+  header: string;
+  avatar_static: string;
+  fields: Immutable.List<AccountField>;
+  acct: string;
+  username: string;
+} = {
   acct: '',
   avatar: '',
   avatar_static: '',
@@ -95,6 +131,7 @@ export const accountDefaultValues: AccountShape = {
   limited: false,
   moved: null,
   hide_collections: false,
+  account_css: '',
 };
 
 const AccountFactory = ImmutableRecord<AccountShape>(accountDefaultValues);

app/javascript/flavours/glitch/styles/neuromatchstodon/myspace.scss

@@ -1,3 +1,4 @@
 #account_account_css {
   font-family: $font-monospace;
+  height: 15em;
 }

app/serializers/rest/account_serializer.rb

@@ -8,7 +8,8 @@ class REST::AccountSerializer < ActiveModel::Serializer
 
   attributes :id, :username, :acct, :display_name, :locked, :bot, :discoverable, :indexable, :group, :created_at,
              :note, :url, :uri, :avatar, :avatar_static, :header, :header_static,
-             :followers_count, :following_count, :statuses_count, :last_status_at, :hide_collections
+             :followers_count, :following_count, :statuses_count, :last_status_at, :hide_collections,
+             :account_css
 
   has_one :moved_to_account, key: :moved, serializer: REST::AccountSerializer, if: :moved_and_not_nested?
 

app/views/accounts/show.html.haml

@@ -11,10 +11,6 @@
   - @account.fields.select(&:verifiable?).each do |field|
     %link{ rel: 'me', type: 'text/html', href: field.value }/
 
-  - if @account.account_css?
-    %style{ nonce: request.content_security_policy_nonce }
-      = @account.account_css
-
   = opengraph 'og:type', 'profile'
   = render 'og', account: @account, url: short_account_url(@account, only_path: false)