Skip to content

Commit b090932

Browse files
authored
fix image preview when uploading (#694)
1 parent d416ce9 commit b090932

7 files changed

Lines changed: 29 additions & 22 deletions

File tree

lib/mindwendel_web/live/idea_live/form_component.html.heex

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,12 @@
1818
</div>
1919
<% end %>
2020
<%= for entry <- @uploads.attachment.entries do %>
21+
<div class="d-flex align-items-center gap-2 mb-2">
22+
<%= if Attachments.simplified_attached_file_type(entry.client_type) == "image" do %>
23+
<.live_img_preview entry={entry} width="60" height="60" />
24+
<% end %>
25+
<span class="text-muted">{entry.client_name}</span>
26+
</div>
2127
<div :for={err <- upload_errors(@uploads.attachment, entry)} class="alert alert-danger">
2228
{error_to_string(err)}
2329
</div>

lib/mindwendel_web/plugs/set_response_header_content_security_policy.ex

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -36,7 +36,8 @@ defmodule Mindwendel.Plugs.SetResponseHeaderContentSecurityPolicy do
3636
"frame-src 'self' ;",
3737

3838
# We add csp sources https: to allow the browser to load the link preview image extracted from the idea body
39-
"img-src 'self' data: https: ;",
39+
# We add blob: to allow live_img_preview to display client-side upload previews
40+
"img-src 'self' data: https: blob: ;",
4041

4142
# We need to add csp 'unsafe-eval', otherwise we get an error in development
4243
# because webpack js bundle uses `eval` for hot reloading.

priv/gettext/de/LC_MESSAGES/default.po

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,8 @@ msgstr "Achtung: Hiermit löschst du das Brainstorming und alle dazugehörigen I
4949

5050
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:34
5151
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:36
52-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:55
53-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:57
52+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:61
53+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:63
5454
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:16
5555
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:18
5656
#, elixir-autogen, elixir-format
@@ -118,14 +118,14 @@ msgid "Proceed to your brainstorming"
118118
msgstr "Weiter zu deinem Brainstorming"
119119

120120
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:39
121-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:60
121+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:66
122122
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:21
123123
#, elixir-autogen, elixir-format
124124
msgid "Save"
125125
msgstr "Speichern"
126126

127127
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:38
128-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:59
128+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:65
129129
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:20
130130
#, elixir-autogen, elixir-format
131131
msgid "Saving..."
@@ -469,7 +469,7 @@ msgid "Additional Attachment"
469469
msgstr "Zusätzlicher Anhang"
470470

471471
#: lib/mindwendel_web/live/idea_live/card_component.html.heex:83
472-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:43
472+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:49
473473
#: lib/mindwendel_web/live/idea_live/show_component.html.heex:27
474474
#, elixir-autogen, elixir-format
475475
msgid "No filename"

priv/gettext/default.pot

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -48,8 +48,8 @@ msgstr ""
4848

4949
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:34
5050
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:36
51-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:55
52-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:57
51+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:61
52+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:63
5353
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:16
5454
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:18
5555
#, elixir-autogen, elixir-format
@@ -117,14 +117,14 @@ msgid "Proceed to your brainstorming"
117117
msgstr ""
118118

119119
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:39
120-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:60
120+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:66
121121
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:21
122122
#, elixir-autogen, elixir-format
123123
msgid "Save"
124124
msgstr ""
125125

126126
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:38
127-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:59
127+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:65
128128
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:20
129129
#, elixir-autogen, elixir-format
130130
msgid "Saving..."
@@ -468,7 +468,7 @@ msgid "Additional Attachment"
468468
msgstr ""
469469

470470
#: lib/mindwendel_web/live/idea_live/card_component.html.heex:83
471-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:43
471+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:49
472472
#: lib/mindwendel_web/live/idea_live/show_component.html.heex:27
473473
#, elixir-autogen, elixir-format
474474
msgid "No filename"

priv/gettext/en/LC_MESSAGES/default.po

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,8 @@ msgstr ""
4949

5050
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:34
5151
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:36
52-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:55
53-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:57
52+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:61
53+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:63
5454
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:16
5555
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:18
5656
#, elixir-autogen, elixir-format
@@ -118,14 +118,14 @@ msgid "Proceed to your brainstorming"
118118
msgstr ""
119119

120120
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:39
121-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:60
121+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:66
122122
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:21
123123
#, elixir-autogen, elixir-format
124124
msgid "Save"
125125
msgstr ""
126126

127127
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:38
128-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:59
128+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:65
129129
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:20
130130
#, elixir-autogen, elixir-format
131131
msgid "Saving..."
@@ -469,7 +469,7 @@ msgid "Additional Attachment"
469469
msgstr ""
470470

471471
#: lib/mindwendel_web/live/idea_live/card_component.html.heex:83
472-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:43
472+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:49
473473
#: lib/mindwendel_web/live/idea_live/show_component.html.heex:27
474474
#, elixir-autogen, elixir-format
475475
msgid "No filename"

priv/gettext/it/LC_MESSAGES/default.po

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -49,8 +49,8 @@ msgstr "Attenzione: Questo cancellerà il brainstorming con tutte le idee associ
4949

5050
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:34
5151
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:36
52-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:55
53-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:57
52+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:61
53+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:63
5454
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:16
5555
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:18
5656
#, elixir-autogen, elixir-format
@@ -118,14 +118,14 @@ msgid "Proceed to your brainstorming"
118118
msgstr "Procedi al tuo brainstorming"
119119

120120
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:39
121-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:60
121+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:66
122122
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:21
123123
#, elixir-autogen, elixir-format
124124
msgid "Save"
125125
msgstr "Salva"
126126

127127
#: lib/mindwendel_web/live/comment_live/form_component.html.heex:38
128-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:59
128+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:65
129129
#: lib/mindwendel_web/live/lane_live/form_component.html.heex:20
130130
#, elixir-autogen, elixir-format
131131
msgid "Saving..."
@@ -469,7 +469,7 @@ msgid "Additional Attachment"
469469
msgstr "Allegato aggiuntivo"
470470

471471
#: lib/mindwendel_web/live/idea_live/card_component.html.heex:83
472-
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:43
472+
#: lib/mindwendel_web/live/idea_live/form_component.html.heex:49
473473
#: lib/mindwendel_web/live/idea_live/show_component.html.heex:27
474474
#, elixir-autogen, elixir-format
475475
msgid "No filename"

test/mindwendel_web/live/response_header_content_security_policy_test.exs

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ defmodule MindwendelWeb.ResponseHeaderContentSecurityPolicyTest do
6060

6161
assert conn_response
6262
|> get_resp_header("content-security-policy")
63-
|> List.first() =~ ~r/(img-src)\s+('self' data: https:) ;/
63+
|> List.first() =~ ~r/(img-src)\s+('self' data: https: blob:) ;/
6464
end
6565
end
6666

0 commit comments

Comments
 (0)