diff --git a/opentech/apply/funds/forms.py b/opentech/apply/funds/forms.py index 544007cef66cdd9e18d2aa4429a05acfc55e1dc3..99f11d75b1c651e2342999a241347a381785a908 100644 --- a/opentech/apply/funds/forms.py +++ b/opentech/apply/funds/forms.py @@ -4,7 +4,7 @@ from django.utils.translation import ugettext_lazy as _ from django_select2.forms import Select2Widget from opentech.apply.users.models import User -from opentech.apply.utils.image import generate_image_url +from opentech.apply.utils.image import generate_image_tag from .models import ApplicationSubmission, AssignedReviewers, ReviewerRole from .widgets import Select2MultiCheckboxesWidget @@ -140,7 +140,7 @@ class UpdateReviewersForm(forms.ModelForm): if not image: return '' filter_spec = 'fill-20x20' - return generate_image_url(image, filter_spec) + return generate_image_tag(image, filter_spec) def prepare_field(self, field_name, initial, excluded): field = self.fields[field_name] diff --git a/opentech/apply/funds/tables.py b/opentech/apply/funds/tables.py index da52797aa8437f4d6490b13e75ab3c28acd539c9..a08dc0512c1c99a539bc3cc1a9e205ee380b644e 100644 --- a/opentech/apply/funds/tables.py +++ b/opentech/apply/funds/tables.py @@ -17,7 +17,7 @@ from wagtail.core.models import Page from opentech.apply.funds.models import ApplicationSubmission, Round, ScreeningStatus from opentech.apply.funds.workflow import STATUSES, get_review_active_statuses from opentech.apply.users.groups import STAFF_GROUP_NAME -from opentech.apply.utils.image import generate_image_url +from opentech.apply.utils.image import generate_image_tag from opentech.images.models import CustomImage from .widgets import Select2MultiCheckboxesWidget @@ -151,7 +151,7 @@ class SummarySubmissionsTableWithRole(BaseAdminSubmissionsTable): image = CustomImage.objects.filter(id=value).first() if image: filter_spec = 'fill-20x20' - return generate_image_url(image, filter_spec) + return generate_image_tag(image, filter_spec) return '' diff --git a/opentech/apply/utils/image.py b/opentech/apply/utils/image.py index 0075c46ee67d598d43e1732ee33c53821e2b0bac..96e9c611478d2d4c90d293cf220a36be748a512d 100644 --- a/opentech/apply/utils/image.py +++ b/opentech/apply/utils/image.py @@ -7,4 +7,9 @@ def generate_image_url(image, filter_spec): signature = generate_signature(image.id, filter_spec) url = reverse('wagtailimages_serve', args=(signature, image.id, filter_spec)) url += image.file.name[len('original_images/'):] + return url + + +def generate_image_tag(image, filter_spec): + url = generate_image_url(image. filter_spec) return format_html(f'<img alt="{image.title}" src="{url}">') diff --git a/opentech/static_src/src/app/src/components/ReviewBlock/index.js b/opentech/static_src/src/app/src/components/ReviewBlock/index.js index a52c47df9e3fca4ca18e038af9df1ce2afc036c7..4fd9c7a98058cedafd29b9dea087f24ecd429751 100644 --- a/opentech/static_src/src/app/src/components/ReviewBlock/index.js +++ b/opentech/static_src/src/app/src/components/ReviewBlock/index.js @@ -3,11 +3,10 @@ import PropTypes from 'prop-types' import './styles.scss'; -export const Opinion = ({ author, opinion }) => ( +export const Opinion = ({ author, icon, opinion }) => ( <li className="reviews-sidebar__item reviews-sidebar__item--decision"> <div className="reviews-sidebar__name"> - <span>{author}</span> - {/* <img src={opinion.author.role.icon} /> */} + <span>{author}</span><img src={icon} /> </div> <div></div> <div className={`reviews-sidebar__outcome ${opinion.toLowerCase()}`}>{opinion}</div> @@ -16,13 +15,14 @@ export const Opinion = ({ author, opinion }) => ( Opinion.propTypes = { author: PropTypes.string, + icon: PropTypes.string, opinion: PropTypes.string, } -export const AssignedToReview = ({ author }) => { +export const AssignedToReview = ({ author, icon }) => { return ( <li className="reviews-sidebar__item"> - <div>{author}</div> + <div className="reviews-sidebar__name">{author}<img src={icon} /></div> <div>-</div> <div>-</div> </li> @@ -30,16 +30,21 @@ export const AssignedToReview = ({ author }) => { } AssignedToReview.propTypes = { + icon: PropTypes.string, author: PropTypes.string, } -export const Review = ({ url, author, score, recommendation, children }) => { +export const Review = ({ url, author, icon, score, recommendation, children }) => { const hasOpinions = children.length > 0; return ( <> <li className="reviews-sidebar__item"> - <a target="_blank" rel="noopener noreferrer" href={url}>{author}</a> + <a target="_blank" rel="noopener noreferrer" href={url}> + <div className="reviews-sidebar__name"> + {author}<img src={icon} /> + </div> + </a> <div>{recommendation.display}</div> <div>{parseFloat(score).toFixed(1)}</div> </li> @@ -55,6 +60,7 @@ export const Review = ({ url, author, score, recommendation, children }) => { Review.propTypes = { author: PropTypes.string.isRequired, + icon: PropTypes.string, score: PropTypes.oneOfType([PropTypes.number, PropTypes.string]).isRequired, recommendation: PropTypes.shape({ display: PropTypes.string.isRequired, diff --git a/opentech/static_src/src/app/src/containers/ReviewInformation.js b/opentech/static_src/src/app/src/containers/ReviewInformation.js index 93628f57afc059cb6b2856712ecb746baf4c4f23..909c00b2534591ff6097703cedd5bc1f7ced231d 100644 --- a/opentech/static_src/src/app/src/containers/ReviewInformation.js +++ b/opentech/static_src/src/app/src/containers/ReviewInformation.js @@ -56,6 +56,7 @@ const ReviewInformation = ({ data }) => { key={reviewer.id} url={review.url} author={reviewer.name} + icon={reviewer.role.icon} score={review.score} recommendation={review.recommendation} > {review.opinions.map((opinion, i) => { @@ -63,6 +64,7 @@ const ReviewInformation = ({ data }) => { return <Opinion key={i} author={author.name} + icon={author.role.icon} opinion={opinion.opinion} /> })}