 Git = (name) -> rclass
     reduxProps:
         "#{name}" :
-            git_repo_root : rtypes.string
-            git_status    : rtypes.string
-            git_diff      : rtypes.string
-
-    propTypes:
+            tab               : rtypes.string
+            git_repo_root     : rtypes.string
+            git_commit_return : rtypes.string
+            git_status        : rtypes.string
+            git_diff          : rtypes.string
+
+    propTypes :
         actions : rtypes.object
 
-    render_status: ->
+    render_configuration_header : ->
+        <Tip delayShow=1300
+             title="Configuration" tip="This tab lists all ">
+            <span>
+                <Icon name="cogs"/> Configuration
+            </span>
+        </Tip>
+
+    render_commit_header : ->
+        <Tip delayShow=1300
+             title="Commit" tip="This tab lists all ">
+            <span>
+                <Icon name="cogs"/> Commit
+            </span>
+        </Tip>
+
+    render_commit_message_input : ->
+        <Input
+            ref         = 'commit_message'
+            type        = 'text'
+            placeholder = 'Commit message'
+            onChange    = {=>@setState(commit_message:@refs.commit_message.getValue())}
+            onKeyDown   = {@props.actions.commit} />
+
+    render_commit_panel : ->
+        head =
+            <span>
+                git commit -a -m "{@render_commit_message_input()}" 
+                <Button
+                    onClick  = {@props.actions.commit} >
+                    Run
+                </Button>
+            </span>
+        <Panel header={head}>
+            {<pre>{@props.git_commit_return}</pre> if @props.git_commit_return}
+        </Panel>
+
+    render_status : ->
         head =
             <span>
                 git status

                    @setState(git_diff : '')
                else
                    @setState(git_diff : output.stdout)


exports.init_redux = init_redux = (redux, project_id, filename) ->

            {<pre>{@props.git_diff}</pre> if @props.git_diff}
        </Panel>

    render_configuration : ->
        <Row>
            <Col sm=6>

            </Col>
        </Row>

    render_commit : ->
        <div>
            <Row>
                <Col sm=4>
                    {@render_commit_panel()}
                </Col>
                <Col sm=4>
                    {@render_status()}
                </Col>
                <Col sm=4>
                    {@render_diff()}
                </Col>
            </Row>
        </div>

    render : ->
        <div>
            <h2>Git Repository at {@props.git_repo_root}</h2>
            <Tabs animation={false} activeKey={@props.tab} onSelect={(key)=>@props.actions.set_tab(key)}>
                <Tab eventKey={'configuration'} title={@render_configuration_header()}>
                    <div style={marginTop:'8px'}></div>
                    {@render_configuration()}
                </Tab>
                <Tab eventKey={'commit'} title={@render_commit_header()}>
                    <div style={marginTop:'8px'}></div>
                    {@render_commit()}
                </Tab>
            </Tabs>

        </div>

render = (redux, project_id, path) ->
