     kd.utils.defer =>
       actions.setMachineListItem @machine('_id'), this
 
+      if @state.requiredInvitationMachine
+        if @state.requiredInvitationMachine.get('_id') is @machine '_id'
+          if @state.activeInvitationMachineId isnt @machine '_id'
+            # to show invitation widget for both on initial load and after a
+            # realtime event. This is probably an anti pattern, to do this in
+            # this component here. I will fix it with the restructure of
+            # sidebar. ~Umut
+            setActiveInvitationMachineId { machine: @props.machine }
+            @setCoordinates()
+
+      if @state.activeInvitationMachineId
+        @setCoordinates()
+
+
+  setCoordinates: ->
+
+    return  unless @refs.sidebarMachinesListItem
+
+    coordinates = getBoundingClientReact @refs.sidebarMachinesListItem
+
+    debug 'setcoordinates', coordinates
+    @setState { coordinates: coordinates }
+
 
   componentWillUnmount: ->
 

  componentDidMount: ->

    { computeController } = kd.singletons

    # Shared/Collab or Managed machines does not have any stacks ~ GG
    if stackId = @props.stack?.get '_id'


  renderInvitationWidget: ->

    debug 'machine id', @props.machine.get '_id'
    debug 'invitaion id', @state.activeInvitationMachineId
    debug 'coordinates', @state.coordinates

    return null  unless @state.coordinates
    return null  unless @props.machine.get('_id') is @state.activeInvitationMachineId

    debug 'invited widget is about to be rendered'

    <SharingMachineInvitationWidget
      key="InvitationWidget-#{@props.machine.get '_id'}"
