 {div, h2, li, ul} = React.DOM
 el = React.createElement
 
-ProfilePage.Main = React.createClass
-  mixins: [StickyTabsMixin, ScrollingPageMixin]
-
-  getInitialState: ->
+pages = document.getElementsByClassName("js-switchable-mode-page--scrollspy")
+pagesOffset = document.getElementsByClassName("js-switchable-mode-page--scrollspy-offset")
+
+currentLocation = ->
+  "#{document.location.pathname}#{document.location.search}"
+
+
+class ProfilePage.Main extends React.PureComponent
+  constructor: (props) ->
+    super props
+
     savedStateString = document.body.dataset.profilePageState
     if savedStateString?
       return JSON.parse(savedStateString)

      el component, props


  setCurrentMode: (_e, {mode}) ->
    return if @state.currentMode == mode
    @setState currentMode: @validMode(mode)


  updateOrder: (event) ->
    $elems = $(event.target)

    newOrder = $elems.sortable('toArray', attribute: 'data-page-id')

            @extraPage name, extraPageParams[name]


  _tabsStick: (_e, target) =>
    newState = (target == 'page-extra-tabs')
    @setState(tabsSticky: newState) if newState != @state.tabsSticky


  extraPage: (name, {extraClass, props, component}) =>
    topClassName = 'js-switchable-mode-page--scrollspy js-switchable-mode-page--page'
    props.withEdit = @props.withEdit
    props.name = name
