Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature: Show Recent People I've Tipped #7830

Merged
merged 5 commits into from
Nov 10, 2020
Merged

Feature: Show Recent People I've Tipped #7830

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
cf012f6
fetch recently tipped profiles
sebastiantf Nov 6, 2020
66197a6
display recent_tips_profiles
sebastiantf Nov 6, 2020
175ff4e
display tooltip for recent_tips_profiles
sebastiantf Nov 6, 2020
27a8b51
handle selecting recent_tips_profiles
sebastiantf Nov 6, 2020
9e8401c
Merge branch 'master' into show-recent-users-tipped
thelostone-mc Nov 7, 2020
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
92 changes: 92 additions & 0 deletions app/dashboard/templates/onepager/send2.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -30,6 +30,19 @@
<script src="{% static "onepager/js/confetti.js" %}"></script>
<script src="{% static "v2/js/user-search.js" %}"></script>
<script src="{% static "v2/js/tooltip_hover.js" %}"></script>
<script>
$('.user-tooltip > .user-img').click(function() {
$('.user-tooltip > .user-img').removeClass('active');
$(this).addClass('active');
$('#username').empty();
parent = $(this).parent('.user-tooltip');
$('#username').append(`<option value="${parent.attr("user-id")}" avatar_url="${parent.attr("avatar-url")}" preferred_payout_address="${parent.attr("preferred_payout_address")}">${parent.attr("username")}</option>`)
});
$('#username').on('select2:select', function(e) {
$('.user-tooltip > .user-img').removeClass('active');
$(`.user-tooltip[user-id=${e.params.data.id}] > .user-img`).addClass('active');
});
</script>
{% endblock %}
<!-- Main -->
{% block 'main' %}
Expand Down Expand Up @@ -63,6 +76,68 @@
.terms {
margin-top: 0.75rem;
}

.recent-tips {
color: var(--gc-dark-grey);
text-align: left;
}
.recent-tips .label {
float: left;
width: 15%;
line-height: 1.2;
}
.recent-tips ul {
list-style: none;
}
.recent-tips-list img {
max-width: 40px;
border-radius: 50%;
padding: 2px;
}
.recent-tips-list img:hover {
box-shadow: 0 0 0 2px var(--gc-green-hover);
cursor: pointer;
}
.recent-tips-list img.active {
box-shadow: 0 0 0 2px var(--gc-blue);
}
.recent-tips-list a:hover {
text-decoration: none;
}

.user-tooltip {
position: relative;
display: inline-block;
}
.user-tooltip .user-tooltip-text {
visibility: hidden;

background-color: #ffffff;
border: 1px solid var(--gc-dark-grey);
border-radius: 2px;
padding: 3px;

top: 100%;
left:50%;
transform:translateX(-50%);

text-align: center;
width: max-content;
position: absolute;
z-index: 1;
margin-top: 5px;

opacity: 0;
transition: all 0.3s;
}
.user-tooltip:hover .user-tooltip-text {
visibility: visible;
opacity: 1;
}
.user-tooltip .user-tooltip-text a {
color: var(--gc-dark-grey) !important;
}

</style>
<div>
<canvas id="world" style="position:fixed; top:0px; left: 0px;"></canvas>
Expand Down Expand Up @@ -103,6 +178,23 @@ <h1>{% trans "Send Tip." %}</h1>
{% endif %}
</select>
</div>
{% if recent_tips_profiles %}
<div class="my-3 recent-tips">
<span class="label my-2 font-smaller-5">{% trans "Recently Sent" %}</span>
<div>
<ul><li class="recent-tips-list">
{% for profile in recent_tips_profiles %}
{% if profile %}
<div class="user-tooltip" user-id="{{profile.id}}" username="{{profile.username}}" avatar-url="{{profile.avatar_url}}" preferred_payout_address="{{profile.preferred_payout_address}}">
<img class="user-img" src="{{profile.avatar_url}}">
<div class='user-tooltip-text tooltip-xs'><a href="{% url 'profile' profile %}" target="_blank">@{{profile.username}}</a></div>
</div>
{% endif %}
{% endfor %}
</li></ul>
</div>
</div>
{% endif %}
{% if is_staff %}
<div class="terms pb-1">
<input type="checkbox" id="secret_link" value="1" >
Expand Down
12 changes: 11 additions & 1 deletion app/dashboard/tip_views.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -462,6 +462,15 @@ def send_tip_2(request):
user['avatar_url'] = profile.avatar_baseavatar_related.filter(active=True).first().avatar_url
user['preferred_payout_address'] = profile.preferred_payout_address

recent_tips = Tip.objects.filter(sender_profile=request.user.profile).order_by('-created_on')
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

recent_tips_profiles = Profile.objects.filter(received_tips__in=Tip.objects.filter(sender_profile__id=7766)).order_by('-received_tips__created_on')

Unfortunately you can't use distinct here or it could be a one-liner! https://docs.djangoproject.com/en/dev/ref/models/querysets/#distinct

Anyway, no need to change the code, but thought it was an interesting way to access the profiles directly..

Copy link
Contributor Author

@sebastiantf sebastiantf Nov 6, 2020 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, I spent 1.5+ days only on trying to make this one query better and efficient. But couldn't find a way to make it a single query/one-liner. Tried several several several ways, but no use. That's a bummer ☹️

Another good one may look something like:

recent_tips_profiles = Tip.objects.filter(sender_profile=request.user.profile).distinct('recipient_profile').order_by('-created_on')

But it produces this error on Postgres:
ERROR: SELECT DISTINCT ON expressions must match initial ORDER BY expressions

I did find this: https://code.djangoproject.com/ticket/24218. But it's still new.

Tried several other ways too. But had to settle with this in the end. 🤢

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

yeah it really exposes where the ORM falls short, basically since you are joining tables then the rows are no longer distinct

recent_tips_profiles = []

for tip in recent_tips:
if len(recent_tips_profiles) == 7:
break
if tip.recipient_profile not in recent_tips_profiles:
recent_tips_profiles.append(tip.recipient_profile)

params = {
'issueURL': request.GET.get('source'),
'class': 'send2',
Expand All @@ -470,7 +479,8 @@ def send_tip_2(request):
'from_handle': from_username,
'title': 'Send Tip | Gitcoin',
'card_desc': 'Send a tip to any github user at the click of a button.',
'fund_request': fund_request
'fund_request': fund_request,
'recent_tips_profiles': recent_tips_profiles
}

if user:
Expand Down