Fixes #18426 - Add actions to notification entries #4265

dLobatog · 2017-02-09T11:18:00Z

This adds support for the notifications to display actions. In case no
actions are provided, the dropdown kebab isn't shown. The actions
possible right now only include GET links.

houndci-bot · 2017-02-09T11:18:15Z

webpack/assets/javascripts/react_app/components/notifications/Notification.test.js

+  it('does not display actions dropdown if links are NOT provided', () => {
+    let notificationWithoutAction = notification
+    delete notificationWithoutAction['actions']['links'];
+    const dropdownMenu = setup(notificationWithoutAction).find('a');


Expected blank line after variable declarations newline-after-var

houndci-bot · 2017-02-09T11:18:15Z

webpack/assets/javascripts/react_app/components/notifications/Notification.test.js

+  });
+  it('does not display actions dropdown if links are NOT provided', () => {
+    let notificationWithoutAction = notification
+    delete notificationWithoutAction['actions']['links'];


["actions"] is better written in dot notation dot-notation
["links"] is better written in dot notation dot-notation

houndci-bot · 2017-02-09T11:18:16Z

webpack/assets/javascripts/react_app/components/notifications/Notification.test.js

+    expect(dropdownMenu.text()).toBe('Foreman blog');
+  });
+  it('does not display actions dropdown if links are NOT provided', () => {
+    let notificationWithoutAction = notification


Expected blank line after variable declarations newline-after-var
Missing semicolon semi

houndci-bot · 2017-02-09T11:18:16Z

webpack/assets/javascripts/react_app/components/notifications/Notification.test.js

    expect(dateElement.text()).toBe('12/13/16');
  });
+  it('display actions dropdown if links are provided', () => {
+    const dropdownMenu = wrapper.find('a');


Expected blank line after variable declarations newline-after-var

houndci-bot · 2017-02-09T11:18:16Z

webpack/assets/javascripts/react_app/components/notifications/Notification.test.js

+    'links': [
+      {
+        'href':'https://theforeman.org',
+        'title':'Foreman blog'


Missing space before value for key 'title' key-spacing

houndci-bot · 2017-02-09T11:18:17Z

webpack/assets/javascripts/react_app/components/notifications/Notification.test.js

+  actions: {
+    'links': [
+      {
+        'href':'https://theforeman.org',


Missing space before value for key 'href' key-spacing

houndci-bot · 2017-02-09T11:18:17Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+                    {actions["links"][i]["title"]}</a>
+                  </li>
+                 ));
+    };


Unnecessary semicolon no-extra-semi

houndci-bot · 2017-02-09T11:18:17Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+      let li_key ="notification-link-" + i + "-" + id
+      links.push((<li key={li_key} id={li_key}>
+                    <a target="_blank" href={actions["links"][i]["href"]}>
+                    {actions["links"][i]["title"]}</a>


["links"] is better written in dot notation dot-notation
Strings must use singlequote quotes
["title"] is better written in dot notation dot-notation

houndci-bot · 2017-02-09T11:18:18Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+    for (let i = 0; i < actions["links"].length; i++) {
+      let li_key ="notification-link-" + i + "-" + id
+      links.push((<li key={li_key} id={li_key}>
+                    <a target="_blank" href={actions["links"][i]["href"]}>


["links"] is better written in dot notation dot-notation
Strings must use singlequote quotes
["href"] is better written in dot notation dot-notation

houndci-bot · 2017-02-09T11:18:18Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+  let actions_dropdown = "";
+  if (actions["links"] != null) {
+    for (let i = 0; i < actions["links"].length; i++) {
+      let li_key ="notification-link-" + i + "-" + id


Expected blank line after variable declarations newline-after-var
Infix operators must be spaced space-infix-ops
Strings must use singlequote quotes
Missing semicolon semi

houndci-bot · 2017-02-09T11:18:18Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+
+  let actions_dropdown = "";
+  if (actions["links"] != null) {
+    for (let i = 0; i < actions["links"].length; i++) {


["links"] is better written in dot notation dot-notation
Strings must use singlequote quotes

houndci-bot · 2017-02-09T11:18:18Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+  const links = [];
+
+  let actions_dropdown = "";
+  if (actions["links"] != null) {


["links"] is better written in dot notation dot-notation
Strings must use singlequote quotes

houndci-bot · 2017-02-09T11:18:19Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

@@ -18,6 +18,31 @@ const Notification = ({created_at, seen, text, level, id}) => {
    (<strong {...tooltip} className="drawer-pf-notification-message pointer"
             onClick={markAsRead}>{text}</strong>);

+  const links = [];
+
+  let actions_dropdown = "";


Expected blank line after variable declarations newline-after-var
Strings must use singlequote quotes

houndci-bot · 2017-02-09T11:51:16Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+    for (let i = 0; i < actions.links.length; i++) {
+      let li_key ='notification-link-' + i + '-' + id;
+      links.push((<li key={li_key} id={li_key}>
+                    <a target='_blank' href={actions.links[i].href}>


Unexpected usage of singlequote jsx-quotes

houndci-bot · 2017-02-09T11:51:16Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+
+  if (actions.links != null) {
+    for (let i = 0; i < actions.links.length; i++) {
+      let li_key ='notification-link-' + i + '-' + id;


Expected blank line after variable declarations newline-after-var
Infix operators must be spaced space-infix-ops

ohadlevy · 2017-02-09T15:09:33Z

@gailsteiger or @matanwerbner can you have a look please?

ohadlevy · 2017-02-09T15:11:45Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+    }
+
+    actions_dropdown = (
+      <div className="dropdown pull-right dropdown-kebab-pf">


does it make sense to make kebab a component by it self? i can see us using it in many different places

ohadlevy · 2017-02-09T15:12:38Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+
+    actions_dropdown = (
+      <div className="dropdown pull-right dropdown-kebab-pf">
+        <button className="btn btn-link dropdown-toggle" type="button" id="dropdownKebabRight{id}"


maybe it make sense to use https://react-bootstrap.github.io/components.html#btn-dropdowns ?

i think we can implement this component ourself using a stateful React class, more reason for it to be on it's own

We should implement the kebab as a stand alone component using the patternfly markup as a reference. We probably should remove the bootstrap js functionality and replace with a pure react implementation.

thinking of it, the kebab is just an icon, so perhaps we can have it as a css class icon, with onClick to open various panels as component requires

In patternfly, the kebab is a restyled version of a dropdown supporting the same features as the bootstrap dropdown component. I'll check with Roxanne as to whether there are use cases for the dropdown menu or whether the kebab should always be used.

matanwerbner · 2017-02-09T17:47:57Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+  const links = [];
+
+  let actions_dropdown = '';
+


This component may best be put on it's own as a seperate component, accepting a list of links, and then on the parent's render:
{ actions.links && <ActionsDropdown links={actions.links } /> }
that way we dont inflate the notification component too much, and dont have to deal with different types of notifications

matanwerbner · 2017-02-09T17:53:57Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

+  let actions_dropdown = '';
+
+  if (actions.links != null) {
+    for (let i = 0; i < actions.links.length; i++) {


it might be nicer to use array.map
`const links = actions.links.map((link, index) => {

})`

+1 for using map

houndci-bot · 2017-02-13T19:35:19Z

webpack/assets/javascripts/react_app/components/notifications/Notification.js

@@ -27,6 +28,7 @@ const Notification = ({created_at, seen, text, level, id}) => {
  return (
    <div className="drawer-pf-notification">
      <Icon type={level} css="pull-left"></Icon>
+      {actions.links && <Dropdown links={actions.links, id} />}


Unexpected use of comma operator no-sequences

houndci-bot · 2017-02-13T19:35:19Z

webpack/assets/javascripts/react_app/components/common/Dropdown.js

+        <span className="fa fa-ellipsis-v"></span>
+      </button>
+      <ul className="dropdown-menu dropdown-menu-right" aria-labelledby="dropdownKebabRight{id}">
+        {list_links}


Identifier 'list_links' is not in camel case camelcase

houndci-bot · 2017-02-13T19:35:19Z

webpack/assets/javascripts/react_app/components/common/Dropdown.js

+  links.map((link, i) => {
+    let li_key = 'notification-link-' + i + '-' + id;
+
+    list_links.push((<li key={li_key} id={li_key}>


Identifier 'list_links' is not in camel case camelcase
Identifier 'li_key' is not in camel case camelcase

houndci-bot · 2017-02-13T19:35:19Z

webpack/assets/javascripts/react_app/components/common/Dropdown.js

+  const list_links = [];
+
+  links.map((link, i) => {
+    let li_key = 'notification-link-' + i + '-' + id;


Identifier 'li_key' is not in camel case camelcase

houndci-bot · 2017-02-13T19:35:19Z

webpack/assets/javascripts/react_app/components/common/Dropdown.js

+import React from 'react';
+
+const Dropdown = ({ links, id }) => {
+  const list_links = [];


Identifier 'list_links' is not in camel case camelcase

dLobatog · 2017-02-13T19:41:58Z

@ohadlevy @gailsteiger @matanwerbner

Updated - the Dropdown is now in its own component. It accepts the ID in order to create unique ids for the elements (which QE deems useful). I could see making it more general but I think it's best to leave it 'YAGNI' and add it when we actually want it.

Aside from that, I believe I addressed the other comments (using map instead of the for iterator, etc..)

matanwerbner · 2017-02-13T20:22:50Z

webpack/assets/javascripts/react_app/components/common/Dropdown.js

+
+const Dropdown = ({ links, id }) => {
+  const listLinks = [];
+


functional approach to writing this would be:

const listLinks = links.map((link, i) => { const liKey = `notification-link-${i}-${id}` return <li key={liKey} id={liKey}> <a target="_blank" href={link.href}> {link.title}</a> </li> }

That's true - haste is the enemy of doing a good job 😄 Will update in a moment

ohadlevy · 2017-02-14T08:32:30Z

app/models/notification_recipient.rb

@@ -17,6 +17,7 @@ def payload
      :subject    => notification_blueprint.subject,
      :created_at => notification.created_at,
      :group      => notification_blueprint.group,
+      :actions    => notification_blueprint.actions


how does the actions translate to actual urls given the subject is part of the notification vs notification_blueprint object?

Actions have nothing to do with subject - it's just a dumb set of links for the moment, it can be any hash https://github.com/theforeman/foreman/pull/4265/files#diff-61072566998937ff274a277f94d284e8R12

It can be made more complicated but I'm not sure how good is it to start coding logic nothing is using, this approach works well with the RSS PR (if passing an array of links isn't good enough ,e.g: you want to pass the HTTP action - POST, etc.., that's easily changeable if we need to do it)

houndci-bot · 2017-02-14T08:35:47Z

webpack/assets/javascripts/react_app/components/common/Dropdown.js

+
+const Dropdown = ({ links, id }) => {
+  const listLinks = links.map((link, i) => {
+    const liKey = `notification-link-${i}-${id}`


Missing semicolon semi

gailsteiger · 2017-02-14T10:31:35Z

webpack/assets/javascripts/react_app/components/common/Dropdown.js

+      <button className="btn btn-link dropdown-toggle" type="button" id="dropdownKebabRight{id}"
+               data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
+        <span className="fa fa-ellipsis-v"></span>
+      </button>


The component is still using bootstrap's dropdown.js plugin to handle the toggle. This is not desirable

Why not? I see it's handled like that on Patternfly and the Angular implementation of Patternfly too.

Patternfly itself doesn't implement a javascript framework so it makes sense that it uses the bootstrap jquery plugins.

With Angular and React the paradigm moves away from direct manipulation markup and adopts the approach of rendering to reflect state. With React the concept of one way data flow is also introduced.

If you have a look at AngularUI Bootstrap (the port of Bootstrap to Angular) you can see that it contains native AngularJS directives and has no dependency on either jQuery or Bootstrap's JS. I don't know why Angular Patternfly chose to not to implement in the same manner.

I think that our components will be easier to reason about if we adopt the pure React approach instead of mixing Reach with the Bootstrap plugins. Specifically, the bootstrap approach was not workable with the Navigation Drawer and Alert/Toasts (which you can see when I update the PR).

I think would be better to encapsulate a click handler in the component rather than rely on the boostrap plugins. In that way it will be easier for us to manage state, render in the React way and initiate actions.

@matanwerbner what do you think?

Agree. We should try to not depend on bootstrap at all, especially on simple or trivial components. A bit of css wil get us where we need.

houndci-bot · 2017-02-17T17:55:50Z

webpack/assets/javascripts/react_app/components/notifications/NotificationDropdown.js

+  });
+
+  return (
+    <Dropdown className="pull-right dropdown-kebab-pf" pullRight key={id} id={`notifications-dropdown-${id}`}>


Line 16 exceeds the maximum line length of 100 max-len

dLobatog · 2017-02-17T17:57:19Z

@matanwerbner @gailsteiger Pushed an updated version that uses the Dropdown component from react-bootstrap, it's quite useful.

I'll submit this implementation to https://idimaster.github.io/patternfly-react/ see if we can hopefully rely on this npm package for every Patternfly component 😄

matanwerbner · 2017-02-17T18:17:07Z

webpack/assets/javascripts/react_app/components/notifications/NotificationDropdown.js

+  });
+
+  return (
+    <Dropdown className="pull-right dropdown-kebab-pf" pullRight key={id}


small comment on style, styling with flex box is easier then pull-right/pull-left... if the containing div has display:flex and justify-content:space-between, the elements drop into position nicely :)

I seem to not be able to do this properly as flex-box centers the text 😞

It's ok, it was just something i thought is the responsibility of the composer (wrapper) component to organize it's children - and not for the child to be opinionated about it's location.

i suggest reading up on flexbox anyway, you may find it easier to deal with then floats

@dLobatog you might find this useful A Complete Guide to Flexbox

gailsteiger · 2017-02-18T17:32:17Z

@dLobatog I don't like react-bootstrap. I think it's overly complicated and tedious to use. I'm not going to object to the PR but I think a simple component would be better.

In this case, you had to use many element tags with the dropdown:

    <Dropdown className="pull-right dropdown-kebab-pf" pullRight key={id}
              id={`notifications-dropdown-${id}`}>
      <Dropdown.Toggle noCaret bsStyle="link">
        <Glyphicon bsClass="fa" glyph="ellipsis-v" />
      </Dropdown.Toggle>
      <Dropdown.Menu>
        {listLinks}
      </Dropdown.Menu>
    </Dropdown>

I would have to consult the documentation every time I used it.

Instead, I think we should be able to achieve something along the lines of

    <Dropdown type="kebab" key={id}  id={`notifications-dropdown-${id}`}>
        {listLinks}
    </Dropdown>

PS: I'm not opposed to using component libraries but some are better than others

dLobatog · 2017-02-20T11:51:25Z

@gailsteiger thanks for taking a look! About react-bootstrap, I thought it would be a good idea to use it since it is already a dependency of Foreman and the component is fully implemented there. This means different types of toggle, dividers, etc.. we don't have to write them. Additionally the docs are pretty good and with a large community I would expect it to not have many bugs or at least have them fixed at a faster rate than if I wrote our own foreman notifications dropdown component (we can always contribute back 😄 ).

@matanwerbner Is the flex-box CSS thing a deal-breaker? I'm no expert or anything but it's what I see the Patternfly implementors use in their examples (http://www.patternfly.org/pattern-library/communication/notification-drawer/#/_code) so I suppose they code Patternfly with the expectations pull-direction is used instead of flex-box.

@gailsteiger @matanwerbner ++ appreciate the feedback!

edit - react-bootstrap, not react-patternfly

gailsteiger · 2017-02-20T14:37:42Z

@dLobatog I presume your above comments are about react-bootstrap and not about react-patternfly.
I am guilty of having introduced the react-bootstrap dependency into foreman. At present I think we use only one component - modal. I tried a few of the other components and removed them for various reasons.
For the purpose of this PR, leave the react-bootstrap Dropdown in.

I still would like to see the feature running. Could you refer me to a live site or help me get the appropriate data into my database.

dLobatog · 2017-02-23T09:30:10Z

@gailsteiger If you want to test this, you can create notifications this way:

1st - Run rake db:migrate to run the migration from this pull request that adds 'actions' to the Notifications table.
2nd - Open the Rails console with rake console from the Foreman directory
3rd - Issue this commands:

blueprint = NotificationBlueprint.new(:group => 'React devs',
                                      :message => 'Hi Gail! This is a notification message',
                                      :level => 'info',
                                      :expires_in => 10.months,
                                      :name => 'gailnotification',
                                      :actions => {"links"=>[{"href"=>"https://theforeman.org/blog", "title"=>"Link to blog"}]})

blueprint.save
notification = Notification.new(:initiator => User.first, :audience => Notification::AUDIENCE_GLOBAL, :notification_blueprint => blueprint)
notification.save

It should automatically show up on the UI after that.

matanwerbner · 2017-02-23T10:08:49Z

@dLobatog seems good from my end,
I feel like the structure of the notification drawer can be greatly improved, but that is for another PR

gailsteiger · 2017-02-23T12:33:12Z

@dLobatog thanks for the rails console instructions. Looks fine by me.

ohadlevy · 2017-02-23T12:47:59Z

webpack/assets/javascripts/react_app/components/notifications/NotificationDropdown.js

+    <Dropdown className="pull-right dropdown-kebab-pf" pullRight key={id}
+              id={`notifications-dropdown-${id}`}>
+      <Dropdown.Toggle noCaret bsStyle="link">
+        <Glyphicon bsClass="fa" glyph="ellipsis-v" />


why not use our Icon component?

I did not see any advantage on using that component vs using what's provided by react-bootstrap, is there any?

ohadlevy · 2017-02-23T12:59:10Z

@matanwerbner can to explain regarding notification structure comment?

ohadlevy · 2017-02-23T13:00:29Z

@dLobatog note that a test has failed, it does look like its un-related, but if you push again it would be nice to confirm.

This adds support for the notifications to display actions. In case no actions are provided, the dropdown kebab isn't shown. The actions possible right now only include GET links.

dLobatog · 2017-02-23T13:17:25Z

Repushed to confirm the error some node tests in Travis is not this PR's fault

ohadlevy · 2017-02-23T14:56:37Z

thanks @dLobatog, katello tests failures are unrelated to this pr.

theforeman-bot added Needs testing Not yet reviewed labels Feb 9, 2017

houndci-bot reviewed Feb 9, 2017

View reviewed changes

dLobatog force-pushed the 18426 branch from 0dee58a to ac4b238 Compare February 9, 2017 11:51

houndci-bot reviewed Feb 9, 2017

View reviewed changes

dLobatog force-pushed the 18426 branch from ac4b238 to c8d0c54 Compare February 9, 2017 11:54

dLobatog mentioned this pull request Feb 9, 2017

Fixes #18292 - Make notifications from an RSS feed #4240

Merged

3 tasks

ohadlevy reviewed Feb 9, 2017

View reviewed changes

matanwerbner reviewed Feb 9, 2017

View reviewed changes

dLobatog added Waiting on contributor and removed Needs testing Not yet reviewed labels Feb 10, 2017

dLobatog force-pushed the 18426 branch from c8d0c54 to ebb4c4a Compare February 13, 2017 19:35

theforeman-bot removed the Waiting on contributor label Feb 13, 2017

theforeman-bot added the Needs testing label Feb 13, 2017

houndci-bot reviewed Feb 13, 2017

View reviewed changes

dLobatog force-pushed the 18426 branch from ebb4c4a to 594b4b7 Compare February 13, 2017 19:39

matanwerbner reviewed Feb 13, 2017

View reviewed changes

ohadlevy reviewed Feb 14, 2017

View reviewed changes

dLobatog force-pushed the 18426 branch from 594b4b7 to 4d6c783 Compare February 14, 2017 08:35

houndci-bot reviewed Feb 14, 2017

View reviewed changes

dLobatog force-pushed the 18426 branch from 4d6c783 to 0ea1da4 Compare February 14, 2017 08:37

gailsteiger reviewed Feb 14, 2017

View reviewed changes

dLobatog force-pushed the 18426 branch from 0ea1da4 to 08b5136 Compare February 17, 2017 17:55

houndci-bot reviewed Feb 17, 2017

View reviewed changes

dLobatog force-pushed the 18426 branch from 08b5136 to 4b09793 Compare February 17, 2017 17:56

matanwerbner reviewed Feb 17, 2017

View reviewed changes

ohadlevy reviewed Feb 23, 2017

View reviewed changes

Fixes #18426 - Add actions to notification entries

dfe1dc6

This adds support for the notifications to display actions. In case no actions are provided, the dropdown kebab isn't shown. The actions possible right now only include GET links.

dLobatog force-pushed the 18426 branch from 4b09793 to dfe1dc6 Compare February 23, 2017 13:17

ohadlevy merged commit db8b122 into theforeman:develop Feb 23, 2017

dLobatog deleted the 18426 branch February 23, 2017 16:03

Fixes #18426 - Add actions to notification entries #4265

Fixes #18426 - Add actions to notification entries #4265

Conversation

dLobatog commented Feb 9, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ohadlevy commented Feb 9, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

gailsteiger Feb 10, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

gailsteiger Feb 10, 2017 • edited Loading

Choose a reason for hiding this comment

matanwerbner Feb 9, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

matanwerbner Feb 9, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dLobatog commented Feb 13, 2017

matanwerbner Feb 13, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dLobatog Feb 14, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

dLobatog commented Feb 17, 2017

matanwerbner Feb 17, 2017 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

gailsteiger commented Feb 18, 2017

dLobatog commented Feb 20, 2017 • edited Loading

gailsteiger commented Feb 20, 2017 • edited Loading

dLobatog commented Feb 23, 2017 • edited Loading

matanwerbner commented Feb 23, 2017

gailsteiger commented Feb 23, 2017

Choose a reason for hiding this comment

Choose a reason for hiding this comment

ohadlevy commented Feb 23, 2017

ohadlevy commented Feb 23, 2017

dLobatog commented Feb 23, 2017

ohadlevy commented Feb 23, 2017

gailsteiger Feb 10, 2017 •

edited

Loading

gailsteiger Feb 10, 2017 •

edited

Loading

matanwerbner Feb 9, 2017 •

edited

Loading

matanwerbner Feb 9, 2017 •

edited

Loading

matanwerbner Feb 13, 2017 •

edited

Loading

dLobatog Feb 14, 2017 •

edited

Loading

matanwerbner Feb 17, 2017 •

edited

Loading

dLobatog commented Feb 20, 2017 •

edited

Loading

gailsteiger commented Feb 20, 2017 •

edited

Loading

dLobatog commented Feb 23, 2017 •

edited

Loading