Progress on group account search

Added group member search, group removed account, album add styles

app/javascript/gabsocial/components/account.js

@@ -64,7 +64,7 @@ class Account extends ImmutablePureComponent {
       )
     }
 
-    const actionButton = (onActionClick && actionIcon) ? (
+    const actionButton = (onActionClick && (actionIcon || actionTitle)) ? (
       <Button
         onClick={this.handleAction}
         isOutline={true}

app/javascript/gabsocial/components/album.js

@@ -1,6 +1,5 @@
 import React from 'react'
 import PropTypes from 'prop-types'
-import { NavLink } from 'react-router-dom'
 import ImmutablePropTypes from 'react-immutable-proptypes'
 import ImmutablePureComponent from 'react-immutable-pure-component'
 import { CX } from '../constants'
@@ -15,29 +14,45 @@ class Album extends React.PureComponent {
     // 
   }
 
+  handleOnOpenAlbumCreation = () => {
+
+  }
+
   render() {
-    const { album, isDummy } = this.props
+    const {
+      album,
+      isAddable,
+      isDummy,
+    } = this.props
     
+    const title = isAddable ? 'New album' : 'Album title'
+    const subtitle = isAddable ? '' : '10 Items'
+    const to = isAddable ? undefined : `/photos`
+
     return (
       <div className={[_s.d, _s.minW162PX, _s.px5, _s.flex1].join(' ')}>
         {
           !isDummy &&
-          <NavLink
-            className={[_s.d, _s.noUnderline].join(' ')}
-            to='/'
+          <Button
+            noClasses
+            className={[_s.d, _s.noUnderline, _s.noOutline, _s.bgTransparent].join(' ')}
+            to={to}
+            onClick={isAddable ? this.handleOnOpenAlbumCreation : undefined}
           >
             <div className={[_s.d, _s.w100PC, _s.mt5, _s.mb10].join(' ')}>
               <div className={[_s.d, _s.w100PC, _s.pt100PC].join(' ')}>
                 <div className={[_s.d, _s.posAbs, _s.top0, _s.w100PC, _s.right0, _s.bottom0, _s.left0].join(' ')}>
-                  <div className={[_s.d, _s.w100PC, _s.h100PC, _s.radiusSmall, _s.bgTertiary, _s.border1PX, _s.borderColorSecondary].join(' ')} />
+                  <div className={[_s.d, _s.w100PC, _s.h100PC, _s.aiCenter, _s.jcCenter, _s.radiusSmall, _s.bgTertiary, _s.border1PX, _s.borderColorSecondary].join(' ')}>
+                    { isAddable && <Icon id='add' size='20px' /> }
+                  </div>
                 </div>
               </div>
             </div>
             <div className={[_s.d, _s.w100PC, _s.pt7, _s.mb15].join(' ')}>
-              <Text weight='bold'>Profile Photos</Text>
-              <Text color='secondary' size='small' className={_s.mt5}>1 Item</Text>
+              <Text weight='bold'>{title}</Text>
+              { !isAddable && <Text color='secondary' size='small' className={_s.mt5}>{subtitle}</Text> }
             </div>
-          </NavLink>
+          </Button>
         }
       </div>
     )

app/javascript/gabsocial/components/media_item.js

@@ -95,6 +95,8 @@ class MediaItem extends ImmutablePureComponent {
 
     const statusUrl = `/${account.getIn(['acct'])}/posts/${status.get('id')}`;
 
+    // : todo : fix dimensions to be like albums
+
     return (
       <div className={[_s.d, _s.pt25PC].join(' ')}>
         <div className={containerClasses}>

app/javascript/gabsocial/components/modal/album_create_modal.js

@@ -0,0 +1 @@
+// : todo :