Simplify onboarding images and centralize config around primary/secondary logos (#12118)
* Simplify special snowflake onboarding images and center around primary/secondary logos * Remove left and right navbar customization * Update app/lib/constants/site_config.rb Co-authored-by: Vaidehi Joshi <vaidehi.sj@gmail.com> * Remove spec onboarding images Co-authored-by: Vaidehi Joshi <vaidehi.sj@gmail.com>
This commit is contained in:
parent
e921952414
commit
b2a5a8488d
10 changed files with 7 additions and 114 deletions
|
|
@ -11,9 +11,7 @@ module Admin
|
|||
campaign_sidebar_image
|
||||
mascot_image_url
|
||||
mascot_footer_image_url
|
||||
onboarding_logo_image
|
||||
onboarding_background_image
|
||||
onboarding_taskcard_image
|
||||
].freeze
|
||||
|
||||
VALID_URL = %r{\A(http|https)://([/|.\w\s-])*.[a-z]{2,5}(:[0-9]{1,5})?(/.*)?\z}.freeze
|
||||
|
|
|
|||
|
|
@ -185,10 +185,6 @@ module Constants
|
|||
description: "URL of the website where open positions are posted",
|
||||
placeholder: "Jobs URL"
|
||||
},
|
||||
left_navbar_svg_icon: {
|
||||
description: "The SVG icon used to expand the left navbar navigation menu. Should be a max of 24x24px.",
|
||||
placeholder: SVG_PLACEHOLDER
|
||||
},
|
||||
logo_png: {
|
||||
description: "Used as a fallback to the SVG. Recommended minimum of 512x512px for PWA support",
|
||||
placeholder: IMAGE_PLACEHOLDER
|
||||
|
|
@ -253,14 +249,6 @@ module Constants
|
|||
description: "Background for onboarding splash page",
|
||||
placeholder: IMAGE_PLACEHOLDER
|
||||
},
|
||||
onboarding_logo_image: {
|
||||
description: "Main onboarding display logo image",
|
||||
placeholder: IMAGE_PLACEHOLDER
|
||||
},
|
||||
onboarding_taskcard_image: {
|
||||
description: "Used as the onboarding task-card image",
|
||||
placeholder: IMAGE_PLACEHOLDER
|
||||
},
|
||||
payment_pointer: {
|
||||
description: "Used for site-wide web monetization. " \
|
||||
"See: https://github.com/thepracticaldev/dev.to/pull/6345",
|
||||
|
|
@ -282,12 +270,8 @@ module Constants
|
|||
description: "Add the secret key for Google reCAPTCHA, which is used for reporting abuse",
|
||||
placeholder: "What is the Google reCAPTCHA secret key?"
|
||||
},
|
||||
right_navbar_svg_icon: {
|
||||
description: "The SVG icon used to expand the right navbar navigation menu. Should be a max of 24x24px.",
|
||||
placeholder: SVG_PLACEHOLDER
|
||||
},
|
||||
secondary_logo_url: {
|
||||
description: "Used as the secondary logo",
|
||||
description: "A place for an alternate logo, if you have one. Used throughout member onboarding and in some sign in forms.",
|
||||
placeholder: IMAGE_PLACEHOLDER
|
||||
},
|
||||
spam_trigger_terms: {
|
||||
|
|
|
|||
|
|
@ -120,8 +120,6 @@ class SiteConfig < RailsSettings::Base
|
|||
format: { with: VALID_URL, message: URL_MESSAGE }
|
||||
}
|
||||
|
||||
field :left_navbar_svg_icon, type: :string, default: STACK_ICON
|
||||
field :right_navbar_svg_icon, type: :string, default: LIGHTNING_ICON
|
||||
field :enable_video_upload, type: :boolean, default: false
|
||||
|
||||
# Mascot
|
||||
|
|
@ -162,15 +160,9 @@ class SiteConfig < RailsSettings::Base
|
|||
field :mailchimp_incoming_webhook_secret, type: :string, default: ""
|
||||
|
||||
# Onboarding
|
||||
field :onboarding_logo_image, type: :string, validates: {
|
||||
format: { with: VALID_URL, message: URL_MESSAGE }
|
||||
}
|
||||
field :onboarding_background_image, type: :string, validates: {
|
||||
format: { with: VALID_URL, message: URL_MESSAGE }
|
||||
}
|
||||
field :onboarding_taskcard_image, type: :string, validates: {
|
||||
format: { with: VALID_URL, message: URL_MESSAGE }
|
||||
}
|
||||
field :suggested_tags, type: :array, default: %w[]
|
||||
field :suggested_users, type: :array, default: %w[]
|
||||
field :prefer_manual_suggested_users, type: :boolean, default: false
|
||||
|
|
|
|||
|
|
@ -805,28 +805,6 @@
|
|||
<% end %>
|
||||
</div>
|
||||
|
||||
<div class="crayons-field">
|
||||
<%= admin_config_label :left_navbar_svg_icon %>
|
||||
<%= admin_config_description Constants::SiteConfig::DETAILS[:left_navbar_svg_icon][:description] %>
|
||||
<%= f.text_area :left_navbar_svg_icon,
|
||||
class: "crayons-textfield",
|
||||
value: SiteConfig.left_navbar_svg_icon,
|
||||
rows: 6,
|
||||
placeholder: Constants::SiteConfig::DETAILS[:left_navbar_svg_icon][:placeholder] %>
|
||||
<%= SiteConfig.left_navbar_svg_icon.html_safe %>
|
||||
</div>
|
||||
|
||||
<div class="crayons-field">
|
||||
<%= admin_config_label :right_navbar_svg_icon %>
|
||||
<%= admin_config_description Constants::SiteConfig::DETAILS[:right_navbar_svg_icon][:description] %>
|
||||
<%= f.text_area :right_navbar_svg_icon,
|
||||
class: "crayons-textfield",
|
||||
value: SiteConfig.right_navbar_svg_icon,
|
||||
rows: 6,
|
||||
placeholder: Constants::SiteConfig::DETAILS[:right_navbar_svg_icon][:placeholder] %>
|
||||
<%= SiteConfig.right_navbar_svg_icon.html_safe %>
|
||||
</div>
|
||||
|
||||
<%= render "form_submission", f: f %>
|
||||
</fieldset>
|
||||
</div>
|
||||
|
|
@ -1064,20 +1042,6 @@
|
|||
} %>
|
||||
<div id="onboardingBodyContainer" class="card-body collapse hide" aria-labelledby="onboardingBodyContainer">
|
||||
<fieldset class="flex flex-column gap-4">
|
||||
<div class="crayons-field">
|
||||
<%= admin_config_label :onboarding_logo_image %>
|
||||
<%= admin_config_description Constants::SiteConfig::DETAILS[:onboarding_logo_image][:description] %>
|
||||
<%= f.text_field :onboarding_logo_image,
|
||||
class: "crayons-textfield",
|
||||
value: SiteConfig.onboarding_logo_image,
|
||||
placeholder: Constants::SiteConfig::DETAILS[:onboarding_logo_image][:placeholder] %>
|
||||
<div class="row mt-2">
|
||||
<div class="col-12">
|
||||
<img alt="main social image" class="img-fluid" src="<%= SiteConfig.onboarding_logo_image %>" width="600px" height="337px" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="crayons-field">
|
||||
<%= admin_config_label :onboarding_background_image %>
|
||||
<%= admin_config_description Constants::SiteConfig::DETAILS[:onboarding_background_image][:description] %>
|
||||
|
|
@ -1092,20 +1056,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="crayons-field">
|
||||
<%= admin_config_label :onboarding_taskcard_image %>
|
||||
<%= admin_config_description Constants::SiteConfig::DETAILS[:onboarding_taskcard_image][:description] %>
|
||||
<%= f.text_field :onboarding_taskcard_image,
|
||||
class: "crayons-textfield",
|
||||
value: SiteConfig.onboarding_taskcard_image,
|
||||
placeholder: Constants::SiteConfig::DETAILS[:onboarding_taskcard_image][:placeholder] %>
|
||||
<div class="row mt-2">
|
||||
<div class="col-12">
|
||||
<img alt="onboarding taskcard image" class="img-fluid" src="<%= SiteConfig.onboarding_taskcard_image %>" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="crayons-field">
|
||||
<%= admin_config_label :suggested_users %>
|
||||
<%= admin_config_description Constants::SiteConfig::DETAILS[:suggested_users][:description] %>
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@
|
|||
<header class="flex items-center p-2 m:p-0 m:pb-2" id="on-page-nav-controls">
|
||||
<button type="button" class="crayons-btn crayons-btn--ghost crayons-btn--icon mr-2 inline-block m:hidden" id="on-page-nav-butt-left" aria-label="nav-button-left">
|
||||
<div class="crayons-icon nav-icon ">
|
||||
<%= SiteConfig.left_navbar_svg_icon.html_safe %>
|
||||
<%= inline_svg_tag("hamburger.svg", aria: true, title: "Left menu") %>
|
||||
</div>
|
||||
</button>
|
||||
<% if user_signed_in? %>
|
||||
|
|
@ -81,7 +81,7 @@
|
|||
|
||||
<button type="button" class="crayons-btn crayons-btn--ghost crayons-btn--icon ml-2 inline-block l:hidden" id="on-page-nav-butt-right" aria-label="nav-button-right">
|
||||
<div class="crayons-icon nav-icon ">
|
||||
<%= SiteConfig.right_navbar_svg_icon.html_safe %>
|
||||
<%= inline_svg_tag("hamburger.svg", aria: true, title: "Right menu") %>
|
||||
</div>
|
||||
</button>
|
||||
</header>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
</button>
|
||||
|
||||
<div>
|
||||
<img alt="onboarding task card image" class="task-card-image" src="<%= safe_logo_url(SiteConfig.onboarding_taskcard_image) %>" />
|
||||
<img alt="onboarding task card image" class="task-card-image" src="<%= safe_logo_url(SiteConfig.secondary_logo_url) %>" />
|
||||
</div>
|
||||
|
||||
<h2 class="task-card-title" id="task-card-title">You're now a part of the community!</h2>
|
||||
|
|
|
|||
|
|
@ -14,7 +14,7 @@
|
|||
<div id="onboarding-container"
|
||||
data-community-name="<%= community_name %>"
|
||||
data-community-description="<%= SiteConfig.community_description %>"
|
||||
data-community-logo="<%= optimized_image_url(safe_logo_url(SiteConfig.onboarding_logo_image)) %>"
|
||||
data-community-logo="<%= optimized_image_url(safe_logo_url(SiteConfig.secondary_logo_url)) %>"
|
||||
data-community-background="<%= optimized_image_url(SiteConfig.onboarding_background_image, width: 1680, quality: 75, random_fallback: false) %>">
|
||||
<%= javascript_packs_with_chunks_tag "Onboarding", defer: true %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -7,7 +7,6 @@ RSpec.describe SiteConfig, type: :model do
|
|||
%w[
|
||||
campaign_sidebar_image main_social_image logo_png secondary_logo_url
|
||||
mascot_image_url mascot_footer_image_url onboarding_background_image
|
||||
onboarding_logo_image onboarding_taskcard_image
|
||||
]
|
||||
end
|
||||
|
||||
|
|
|
|||
|
|
@ -407,22 +407,6 @@ RSpec.describe "/admin/config", type: :request do
|
|||
end.not_to change(SiteConfig, :secondary_logo_url)
|
||||
end
|
||||
|
||||
it "updates left_navbar_svg_icon" do
|
||||
expected_svg = "<svg height='100' width='100'><circle cx='50' cy='50' r='40' " \
|
||||
"stroke='black' stroke-width='3'/></svg>"
|
||||
post "/admin/config", params: { site_config: { left_navbar_svg_icon: expected_svg },
|
||||
confirmation: confirmation_message }
|
||||
expect(SiteConfig.left_navbar_svg_icon).to eq(expected_svg)
|
||||
end
|
||||
|
||||
it "updates right_navbar_svg_icon" do
|
||||
expected_svg = "<svg height='100' width='100'><circle cx='50' cy='50' r='40' " \
|
||||
"stroke='black' stroke-width='1'/></svg>"
|
||||
post "/admin/config", params: { site_config: { right_navbar_svg_icon: expected_svg },
|
||||
confirmation: confirmation_message }
|
||||
expect(SiteConfig.right_navbar_svg_icon).to eq(expected_svg)
|
||||
end
|
||||
|
||||
it "rejects update without proper confirmation" do
|
||||
expected_image_url = "https://dummyimage.com/300x300.png"
|
||||
expect do
|
||||
|
|
@ -588,20 +572,6 @@ RSpec.describe "/admin/config", type: :request do
|
|||
end
|
||||
|
||||
describe "Onboarding" do
|
||||
it "updates onboarding_taskcard_image" do
|
||||
expected_image_url = "https://dummyimage.com/300x300.png"
|
||||
post "/admin/config", params: { site_config: { onboarding_taskcard_image: expected_image_url },
|
||||
confirmation: confirmation_message }
|
||||
expect(SiteConfig.onboarding_taskcard_image).to eq(expected_image_url)
|
||||
end
|
||||
|
||||
it "updates onboarding_logo_image" do
|
||||
expected_image_url = "https://dummyimage.com/300x300.png"
|
||||
post "/admin/config", params: { site_config: { onboarding_logo_image: expected_image_url },
|
||||
confirmation: confirmation_message }
|
||||
expect(SiteConfig.onboarding_logo_image).to eq(expected_image_url)
|
||||
end
|
||||
|
||||
it "updates onboarding_background_image" do
|
||||
expected_image_url = "https://dummyimage.com/300x300.png"
|
||||
post "/admin/config", params: { site_config: { onboarding_background_image: expected_image_url },
|
||||
|
|
|
|||
|
|
@ -25,14 +25,14 @@ RSpec.describe "Onboardings", type: :request do
|
|||
end
|
||||
|
||||
it "contains proper data attribute values if the onboarding config is present" do
|
||||
allow(SiteConfig).to receive(:onboarding_logo_image).and_return("onboarding_logo_image.png")
|
||||
allow(SiteConfig).to receive(:secondary_logo_url).and_return("whatevs.png")
|
||||
allow(SiteConfig).to receive(:onboarding_background_image).and_return("onboarding_background_image.png")
|
||||
|
||||
sign_in user
|
||||
get onboarding_url
|
||||
|
||||
expect(response.body).to include(SiteConfig.community_description)
|
||||
expect(response.body).to include(safe_logo_url(SiteConfig.onboarding_logo_image))
|
||||
expect(response.body).to include(safe_logo_url(SiteConfig.secondary_logo_url))
|
||||
expect(response.body).to include(SiteConfig.onboarding_background_image)
|
||||
end
|
||||
end
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue