disco_app 0.8.9 → 0.9.0

data/app/assets/stylesheets/disco_app/ui-kit/_ui-layout.scss

@@ -0,0 +1,10 @@
+//
+// ui-layout.scss
+// Styles for UI layout not provided by the Channel
+// SDK UI Kit.
+// --------------------------------------------------
+
+body {
+  margin: 0;
+  padding: 0;
+}

data/app/assets/stylesheets/disco_app/ui-kit/_ui-page-actions.scss

@@ -0,0 +1,21 @@
+//
+// ui-page-actions.scss
+// Styles for UI page actions not provided by the
+// Channel SDK UI Kit.
+// --------------------------------------------------
+
+.ui-page-actions {
+  @include flexbox();
+  margin: 0 auto 20px auto;
+  max-width: 1036px;
+}
+
+.ui-page-actions__primary {
+  @include flex(1 1 auto);
+  padding-right: 20px;
+}
+
+.ui-page-actions__secondary {
+  @include flex(1 1 auto);
+  padding: 0 20px;
+}

data/app/assets/stylesheets/disco_app/{disco/_tabs.scss → ui-kit/_ui-tabs.scss}

@@ -1,5 +1,7 @@
 //
-// Replicate the styles for Shopify Admin tabs.
+// ui-tabs.scss
+// Styles for tabs not provided by the Channel SDK UI
+// Kit.
 // --------------------------------------------------
 
 .next-tab__list {

data/app/assets/stylesheets/disco_app/ui-kit/_ui-type.scss

@@ -0,0 +1,13 @@
+//
+// ui-type.scss
+// Styles for type not provided by the Channel SDK UI
+// Kit.
+// --------------------------------------------------
+
+hr {
+  color: #e6e6e6;
+  background-color: #e6e6e6;
+  height: 1px;
+  padding: 0;
+  border: 0;
+}

data/app/controllers/disco_app/admin/concerns/plans_controller.rb

@@ -2,7 +2,7 @@ module DiscoApp::Admin::Concerns::PlansController
   extend ActiveSupport::Concern
 
   included do
-    before_action :find_plan, only: [:edit, :update]
+    before_action :find_plan, only: [:edit, :update, :destroy]
   end
 
   def index
@@ -11,7 +11,6 @@ module DiscoApp::Admin::Concerns::PlansController
 
   def new
     @plan = DiscoApp::Plan.new
-    @plan.plan_codes.build
   end
 
   def create
@@ -24,17 +23,21 @@ module DiscoApp::Admin::Concerns::PlansController
   end
 
   def edit
-    @plan.plan_codes.build
   end
 
   def update
     if @plan.update_attributes(plan_params)
-      redirect_to admin_plans_path
+      redirect_to edit_admin_plan_path(@plan)
     else
       render 'edit'
     end
   end
 
+  def destroy
+    @plan.destroy
+    redirect_to admin_plans_path
+  end
+
   private
 
     def find_plan
@@ -44,7 +47,7 @@ module DiscoApp::Admin::Concerns::PlansController
     def plan_params
       params.require(:plan).permit(
         :name, :status, :plan_type, :trial_period_days, :amount,
-        :plan_codes_attributes => [:code, :trial_period_days, :amount]
+        :plan_codes_attributes => [:id, :_destroy, :code, :trial_period_days, :amount]
       )
     end
 

data/app/controllers/disco_app/admin/concerns/subscriptions_controller.rb

@@ -0,0 +1,32 @@
+module DiscoApp::Admin::Concerns::SubscriptionsController
+  extend ActiveSupport::Concern
+
+  included do
+    before_action :find_subscription
+  end
+
+  def edit
+  end
+
+  def update
+    if @subscription.update_attributes(subscription_params)
+      unless (@subscription.previous_changes.keys & ['amount', 'trial_period_days']).empty?
+
+      end
+      redirect_to edit_admin_subscription_path(@subscription)
+    else
+      render 'edit'
+    end
+  end
+
+  private
+
+    def find_subscription
+      @subscription = DiscoApp::Subscription.find_by_id(params[:id])
+    end
+
+    def subscription_params
+      params.require(:subscription).permit(:amount, :trial_period_days)
+    end
+
+end

data/app/controllers/disco_app/admin/subscriptions_controller.rb

@@ -0,0 +1,3 @@
+class DiscoApp::Admin::SubscriptionsController < DiscoApp::Admin::ApplicationController
+  include DiscoApp::Admin::Concerns::SubscriptionsController
+end

data/app/helpers/disco_app/application_helper.rb

@@ -25,4 +25,26 @@ module DiscoApp::ApplicationHelper
     link_to(name, path, options)
   end
 
+  # Render a React component with inner HTML content.
+  # Thanks to https://github.com/reactjs/react-rails/pull/166#issuecomment-86178980
+  def react_component_with_content(name, args = {}, options = {}, &block)
+    args[:__html] = capture(&block) if block.present?
+    react_component(name, args, options)
+  end
+
+  # Provide link to dynamically add a new nested fields association 
+  def link_to_add_fields(name, f, association)
+    new_object = f.object.send(association).klass.new
+    id = new_object.object_id
+    fields = f.fields_for(association, new_object, child_index: id) do |builder|
+      render(association.to_s.singularize + "_fields", f: builder)
+    end
+    link_to(name, '#', class: "add_fields", data: {id: id, fields: fields.gsub("\n", "")})
+  end
+
+  # Helper method that provides detailed error information from an active record as JSON
+  def errors_to_react(record)
+    {type: record.model_name.human.downcase, errors: record.errors.keys, messages: record.errors.full_messages}.as_json
+  end
+
 end

data/app/models/disco_app/concerns/plan.rb

@@ -5,9 +5,9 @@ module DiscoApp::Concerns::Plan
 
     has_many :subscriptions
     has_many :shops, through: :subscriptions
-    has_many :plan_codes
+    has_many :plan_codes, dependent: :destroy
 
-    accepts_nested_attributes_for :plan_codes
+    accepts_nested_attributes_for :plan_codes, allow_destroy: true
 
     enum status: [:available, :unavailable]
     enum plan_type: [:recurring, :one_time]

data/app/models/disco_app/concerns/shop.rb

@@ -71,10 +71,6 @@ module DiscoApp::Concerns::Shop
       distance_of_time_in_words_to_now(created_at.time)
     end
 
-    def pretty_created_at
-        created_at.strftime("%B %d, %Y")
-    end
-
   end
 
 end

data/app/models/disco_app/concerns/subscription.rb

@@ -15,6 +15,8 @@ module DiscoApp::Concerns::Subscription
 
     scope :current, -> { where status: [statuses[:trial], statuses[:active]] }
 
+    after_commit :cancel_charge
+
   end
 
   # Only require an active charge if the amount to be charged is > 0.
@@ -45,4 +47,14 @@ module DiscoApp::Concerns::Subscription
     recurring? ? ShopifyAPI::RecurringApplicationCharge : ShopifyAPI::ApplicationCharge
   end
 
+  private
+
+    # If the amount or trial period for this subscription changes, clear any
+    # active charge, as the user will need to re-authorize the charge.
+    def cancel_charge
+      return if (previous_changes.keys & ['amount', 'trial_period_days']).empty?
+      return unless active_charge?
+      active_charge.cancelled!
+    end
+
 end

data/app/resources/disco_app/admin/resources/concerns/shop_resource.rb

@@ -5,9 +5,10 @@ module DiscoApp::Admin::Resources::Concerns::ShopResource
 
   included do
 
-    attributes :shopify_domain, :status, :email, :country_name
-    attributes :currency, :domain, :plan_display_name, :created_at 
-    attributes :pretty_created_at, :installed_duration
+    attributes :domain, :status, :email, :country_name
+    attributes :currency, :plan_display_name, :created_at
+    attributes :current_subscription_id, :current_subscription_display_amount, :current_subscription_display_plan, :current_subscription_display_plan_code, :current_subscription_source
+    attributes :installed_duration
 
     model_name 'DiscoApp::Shop'
 
@@ -41,5 +42,41 @@ module DiscoApp::Admin::Resources::Concerns::ShopResource
     def self.creatable_fields(context)
       []
     end
+
+    def current_subscription_id
+      if @model.current_subscription?
+        @model.current_subscription.id
+      end
+    end
+
+    def current_subscription_display_amount
+      if @model.current_subscription?
+        @model.current_subscription.amount
+      else
+        '-'
+      end
+    end
+
+    def current_subscription_display_plan
+      if @model.current_subscription?
+        @model.current_plan.name
+      else
+        'None'
+      end
+    end
+
+    def current_subscription_display_plan_code
+      @model.current_subscription&.plan_code&.code
+    end
+
+    def current_subscription_source
+      if @model.current_subscription?
+        @model.current_subscription.source || '-'
+      else
+        '-'
+      end
+    end
+
   end
+
 end

data/app/views/disco_app/admin/plans/_form.html.erb

@@ -1,12 +1,12 @@
 <section class="section">
   <div class="layout-content">
     <section class="layout-content__main">
-      <div class="row">
-        <div class="col-md-12">
+      <div class="next-grid">
+        <div class="next-grid__cell">
           <div class="next-card">
 
               <header class="next-card__header">
-                <h3>Plan</h3>
+                <h1>Plan</h1>
               </header>
 
               <section class="next-card__section">
@@ -37,30 +37,19 @@
               </section>
           </div>
         </div>
-        <div class="col-md-12">
-          <div class="next-card">
-
+        <div class="next-grid__cell">
+          <div class="next-card  next-card--aside">
               <header class="next-card__header">
-                <h3>Plan Codes</h3>
+                <h1>Plan Codes</h1>
               </header>
 
-              <section class="next-card__section">
                 <%= f.fields_for :plan_codes do |plan_code| %>
-                  <div class="row">
-                    <div class="col-md-24">
-                      <%= plan_code.label(:code, 'Code') %>
-                      <%= plan_code.text_field(:code) %>
+                  <%= render 'plan_code_fields', f: plan_code %> 
+                <% end %>
 
-                      <%= plan_code.label(:trial_period_days, 'Trial Period Days') %>
-                      <%= plan_code.number_field(:trial_period_days) %>
+                <br>
 
-                      <%= plan_code.label(:amount, 'Amount') %>
-                      <%= plan_code.number_field(:amount) %>
-                      <hr>
-                    </div>
-                  </div>
-                <% end %>
-              </section>
+                <%= link_to_add_fields('Add New Plan Code', f, :plan_codes) %>
           </div>
         </div>
       </div>
@@ -73,3 +62,11 @@
     </section>
   </div>
 </section>
+<script type="text/javascript">
+  $('form').on('click', '.add_fields', function(event) {
+    var time = new Date().getTime();
+    var regexp = new RegExp($(this).data('id'), 'g');
+    $(this).before($(this).data('fields').replace(regexp, time));
+    event.preventDefault();
+  });
+</script>

data/app/views/disco_app/admin/plans/_plan_code_fields.html.erb

@@ -0,0 +1,15 @@
+<section class="next-card__section">
+    <div class="app-container">
+        <%= f.label(:code, 'Code') %>
+        <%= f.text_field(:code) %>
+
+        <%= f.label(:trial_period_days, 'Trial Period Days') %>
+        <%= f.number_field(:trial_period_days) %>
+
+        <%= f.label(:amount, 'Amount') %>
+        <%= f.number_field(:amount) %>
+        
+        <%= f.label :_destroy, 'Remove Plan' %>
+        <%= f.check_box :_destroy %>
+    </div>
+</section>

data/app/views/disco_app/admin/plans/index.html.erb

@@ -15,6 +15,7 @@
             <th>Currency</th>
             <th>Interval</th>
             <th>Interval Count</th>
+            <th></th>
           </tr>
         </thead>
         <tbody>
@@ -28,6 +29,7 @@
             <td><%= plan.currency %></td>
             <td><%= plan.interval %></td>
             <td><%= plan.interval_count %></td>
+            <td><%= link_to 'Delete', admin_plan_path(plan), action: 'destroy', method: :delete,  data: {confirm: "About to delete plan: #{plan.name}. Are you sure?"} %></td>
           </tr>
           <% end %>
         </tbody>

data/app/views/disco_app/admin/shops/index.html.erb

@@ -5,7 +5,8 @@
 
     <%= react_component('FilterableShopList', {
       shopsUrl: admin_resources_shops_path(format: :json),
-      editShopUrl: edit_admin_shop_path(':id')
+      editShopUrl: edit_admin_shop_path(':id'),
+      editSubscriptionUrl: edit_admin_shop_subscription_path(':shop_id', ':id')
     }) %>
 
   </div>

data/app/views/disco_app/admin/subscriptions/edit.html.erb

@@ -0,0 +1,33 @@
+<% provide(:breadcrumb, 'Shops') %>
+<% provide(:breadcrumb_url, admin_shops_path) %>
+<% provide(:title, 'Edit subscription') %>
+
+<div class="next-grid">
+  <div class="next-grid__cell">
+
+    <%= form_for(@subscription, url: admin_shop_subscription_path(@subscription.shop, @subscription)) do |f| %>
+
+      <%= f.label(:amount) %>
+      <%= f.number_field(:amount) %>
+
+      <%= f.label(:trial_period_days) %>
+      <%= f.number_field(:trial_period_days) %>
+
+      <p>
+        Note that adjusting the amount or trial days of the subscription will
+        clear any charge previously authorized by the user, and they'll be asked
+        to re-authorize the next time they open the application.
+      </p>
+
+      <p>
+        If you're changing the amount of a subscription for an existing user and
+        don't want them to get another trial period, make sure to set "Trial
+        period days" to zero.
+      </p>
+
+      <%= f.submit 'Save', { class: 'btn btn-primary' } %>
+
+    <% end %>
+
+  </div>
+</div>

data/app/views/disco_app/shared/_icons.html.erb

@@ -0,0 +1,3 @@
+<div style="display: none;">
+<svg xmlns="http://www.w3.org/2000/svg"><symbol id="next-products"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" enable-background="new 0 0 24 24"><path d="M21.8 1h-7c-.8 0-1.5.3-2 .8L1.4 13.2c-.5.5-.5 1.3 0 1.8L9 22.7c.5.5 1.3.5 1.8 0l11.3-11.4c.5-.5.8-1.3.8-2v-7c.1-.7-.4-1.3-1.1-1.3zm-4 7.6c-1.3 0-2.3-1.1-2.3-2.3C15.5 5 16.6 4 17.8 4c1.3 0 2.3 1.1 2.3 2.3 0 1.3-1 2.3-2.3 2.3z"/></svg></symbol><symbol id="rte-html"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-html</title><desc>Created with Sketch.</desc><path d="M5 4.406l-3.761 1.603 3.761 1.591v1.4l-5-2.334v-1.327l5-2.339v1.406zm2 0v-1.406l5 2.339v1.327l-5 2.334v-1.4l3.761-1.591-3.761-1.603z" sketch:type="MSShapeGroup" fill="#000"/></svg></symbol><symbol id="rte-formatting"><svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 3 12 12" enable-background="new -1 3 12 12"><title>rte-formatting</title><desc>Created with Sketch.</desc><path d="M10.9 13.2c-.1 0-.3 0-.5-.1-.2 0-.3-.1-.4-.2-.2-.1-.3-.2-.4-.3-.1-.1-.2-.3-.2-.4l-3.9-9.1v-.1h-.8v.1c-.6 1.3-1.2 2.8-1.9 4.4-.7 1.7-1.4 3.2-1.9 4.5l-.3.6c-.1.1-.3.3-.5.4-.1 0-.3.1-.5.1s-.4.1-.5.1h-.1v.8h4.6v-.8h-.1c-.4 0-.8-.1-1.1-.2-.3-.1-.4-.2-.4-.3v-.3c0-.1.1-.3.1-.5l.3-.7c.1-.2.3-.8.5-1.2h3.5l1 2.6v.2s0 .1-.3.1c-.3.1-.6.1-1 .1h-.1v1h5v-.8h-.1zm-5-4.2h-2.7l1.3-3.2 1.4 3.2z"/></svg></symbol><symbol id="next-disclosure"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" enable-background="new 0 0 24 24"><path d="M4.8 8h14.4c.6 0 .9.7.6 1.2l-7.2 8.9c-.3.4-.8.4-1.1 0L4.2 9.2c-.4-.5 0-1.2.6-1.2z"/></svg></symbol><symbol id="rte-bold"><svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 3 12 12" enable-background="new -1 3 12 12"><title>rte-bold</title><desc>Created with Sketch.</desc><path d="M9.7 9.8c-.3-.5-.4-.6-.7-.8-.3-.3-.7-.4-1.1-.6-.4-.1-.8-.2-1.1-.2v-.2l1-.3c.3-.2.6-.3.8-.5.3-.2.5-.5.6-.8.2-.3.2-.6.2-1 0-.8-.3-1.4-.9-1.8-.6-.4-1.6-.6-3-.6h-5.5v.7c.2.1.4.1.5.2.2.1.4.2.4.3.1.1.1.3.1.5v7.7c0 .2 0 .4-.1.5-.1.1-.2.2-.4.3-.1.1-.2.1-.4.1h-.1v.7h5.3c.7 0 1.4 0 2-.1.5-.1 1-.3 1.4-.6.4-.2.8-.5 1-.9.2-.3.3-.8.3-1.4 0-.4 0-.7-.3-1.2zm-6.2-6.1h1.3c.6 0 1.1.2 1.4.5.3.4.5.8.5 1.4 0 .7-.2 1.2-.6 1.6-.4.4-.9.6-1.7.6h-.9v-4.1zm3.1 9c-.3.4-.8.6-1.4.6-.3 0-1-.1-1.3-.2-.2-.1-.3-.3-.4-.5v-4h.7c.8 0 1.9.2 2.3.6.5.4.7 1 .7 1.7 0 .8-.2 1.4-.6 1.8z"/></svg></symbol><symbol id="rte-italic"><svg xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" xmlns="http://www.w3.org/2000/svg" viewBox="-1 3 12 12" enable-background="new -1 3 12 12"><title>rte-italic</title><desc>Created with Sketch.</desc><path sketch:type="MSShapeGroup" d="M9 3l-.3 1c-.1 0-.4 0-.6.1-.3 0-.5.1-.6.1-.3.1-.5.2-.6.3l-.2.5-1.7 7v.2c0 .1 0 .2.1.3.1.1.2.2.3.2.1 0 .3.1.5.1.3.2.5.2.6.2l-.2 1h-5.3l.2-1h.7s.5-.1.6-.1c.2-.1.4-.2.5-.3.1-.1.2-.3.2-.5l1.8-7v-.30000000000000004c0-.1 0-.2-.1-.3 0-.1-.1-.1-.3-.2-.1-.1-.3-.1-.6-.2-.2 0-.4-.1-.5-.1l.2-1h5.3z"/></svg></symbol><symbol id="rte-list"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-list</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><rect sketch:type="MSShapeGroup" width="9" height="2" rx="1" transform="translate(3 5)"/><rect sketch:type="MSShapeGroup" x="3" y="1" width="9" height="2" rx="1"/><rect sketch:type="MSShapeGroup" x="3" y="9" width="9" height="2" rx="1"/><circle sketch:type="MSShapeGroup" cx="1" cy="2" r="1"/><circle sketch:type="MSShapeGroup" cx="1" cy="6" r="1"/><circle sketch:type="MSShapeGroup" cx="1" cy="10" r="1"/></g></svg></symbol><symbol id="rte-list-ordered"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-list-ordered</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><rect sketch:type="MSShapeGroup" width="9" height="2" rx="1" transform="translate(3 5)"/><path d="M0 2.479h.697v-1.943l-.648.152v-.533l.653-.148h.602v2.472h.697v.521h-2v-.521z" sketch:type="MSShapeGroup"/><rect sketch:type="MSShapeGroup" x="3" y="1" width="9" height="2" rx="1"/><path d="M.685 6.481h1.35v.512h-2.035v-.496l.343-.335.743-.734c.107-.113.185-.213.232-.3.047-.087.071-.174.071-.259 0-.131-.043-.233-.13-.304-.087-.072-.209-.107-.368-.107-.113 0-.24.021-.381.062-.141.041-.288.101-.441.18v-.541c.153-.051.303-.09.45-.117.147-.027.287-.04.422-.04.339 0 .606.073.8.218.194.145.291.343.291.594 0 .116-.021.224-.063.325-.042.101-.115.213-.218.337-.076.089-.284.29-.625.603l-.44.406z" sketch:type="MSShapeGroup"/><rect sketch:type="MSShapeGroup" x="3" y="9" width="9" height="2" rx="1"/><path d="M.88 9.646h-.328v-.502h.328c.152 0 .27-.028.354-.084.084-.056.126-.135.126-.237 0-.107-.042-.19-.126-.25-.084-.06-.202-.09-.354-.09-.116 0-.241.014-.374.041-.133.027-.271.066-.413.118v-.518c.143-.04.283-.071.421-.092.138-.021.271-.032.399-.032.327 0 .581.066.764.199.183.133.274.316.274.549 0 .171-.053.311-.158.42-.105.109-.255.18-.45.214.221.036.39.118.506.246.116.128.174.297.174.505 0 .28-.096.493-.289.64-.192.147-.472.22-.839.22-.156 0-.31-.012-.462-.037-.152-.024-.296-.06-.435-.106v-.529c.13.061.271.107.421.138.151.032.309.047.475.047.166 0 .298-.036.394-.107.097-.071.145-.168.145-.289 0-.148-.048-.262-.145-.343-.097-.081-.234-.121-.411-.121z" sketch:type="MSShapeGroup"/></g></svg></symbol><symbol id="rte-outdent"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-outdent</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><g sketch:type="MSLayerGroup"><rect sketch:type="MSShapeGroup" width="12" height="2" rx="1"/><path d="M6 4c0-.552.439-1 .996-1h4.538-.542c.557 0 1.008.444 1.008 1 0 .552-.451 1-.991 1h-4.018c-.547 0-.991-.444-.991-1z" sketch:type="MSShapeGroup"/><rect sketch:type="MSShapeGroup" x="6" y="6" width="6" height="2" rx="1"/><rect sketch:type="MSShapeGroup" y="9" width="12" height="2" rx="1"/></g><path sketch:type="MSShapeGroup" d="M0 5.48l4-2.48v5z"/></g></svg></symbol><symbol id="rte-indent"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-indent</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><g sketch:type="MSLayerGroup"><rect sketch:type="MSShapeGroup" width="12" height="2" rx="1"/><path d="M6 4c0-.552.439-1 .996-1h4.538-.542c.557 0 1.008.444 1.008 1 0 .552-.451 1-.991 1h-4.018c-.547 0-.991-.444-.991-1z" sketch:type="MSShapeGroup"/><rect sketch:type="MSShapeGroup" x="6" y="6" width="6" height="2" rx="1"/><rect sketch:type="MSShapeGroup" y="9" width="12" height="2" rx="1"/></g><path sketch:type="MSShapeGroup" d="M4 5.48l-4-2.48v5z"/></g></svg></symbol><symbol id="rte-justify"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-justify</title><desc>Created with Sketch.</desc><g sketch:type="MSLayerGroup" transform="translate(-1)" fill="#000"><rect sketch:type="MSShapeGroup" x=".994" width="6.003" height="2" rx="1"/><path d="M.994 4c0-.552.454-1 1.009-1h7.992c.554 0 1.004.444 1.004 1 0 .552-.456 1-.996 1h-8.013c-.55 0-.996-.444-.996-1z" sketch:type="MSShapeGroup"/><rect sketch:type="MSShapeGroup" x=".994" y="6" width="8.006" height="2" rx="1"/><rect sketch:type="MSShapeGroup" x=".994" y="9" width="12.006" height="2" rx="1"/></g></svg></symbol><symbol id="rte-color"><svg xmlns="http://www.w3.org/2000/svg" viewBox="-1 3 12 12" enable-background="new -1 3 12 12"><title>rte-color</title><desc>Created with Sketch.</desc><path d="M8.9 10.3c-.1 0-.2 0-.3-.1l-.3-.1-.3-.1-.1-.3-2.5-6.7h-.7v.2c-.4.9-.8 1.9-1.2 3.1-.5 1.2-.9 2.2-1.3 3.2 0 .2-.1.3-.2.4 0 .1-.1.2-.3.3l-.3.1-.3.1h-.1v.6h3.1v-.7h-.1c-.3 0-.5-.1-.7-.1-.2-.1-.3-.1-.3-.2v-.2c0-.1 0-.2.1-.4 0-.2.1-.3.2-.5.1-.1.3-.7.3-.9h2.2l.7 2v.2s-.1 0-.2.1c-.2 0-.4.1-.7.1h-.1v.6h3.5v-.7h-.1zm-3.4-3h-1.6l.8-2.1.8 2.1zM8 12h-6c-.6 0-1 .4-1 1 0 .5.4 1 1 1h6c.6 0 1-.4 1-1 0-.5-.4-1-1-1z"/></svg></symbol><symbol id="rte-link"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-link</title><desc>Created with Sketch.</desc><path d="M7.606 4.394c1.044 1.066 1.057 2.798 0 3.855l-.643.643-.643.643-.643.643c-1.062 1.062-2.791 1.064-3.855 0-1.068-1.068-1.066-2.789 0-3.855l.871-.871c-.045.714.121 1.439.496 2.075l-.081.081c-.357.357-.358.927 0 1.285.354.354.932.353 1.285 0l.643-.643.643-.643.643-.643c.354-.354.354-.931 0-1.285l.643-.643.643-.643zm-3.213 3.213c-1.044-1.066-1.057-2.798 0-3.855l.643-.643.643-.643.643-.643c1.062-1.062 2.791-1.064 3.855 0 1.068 1.068 1.066 2.789 0 3.855l-.871.871c.045-.714-.121-1.439-.496-2.075l.081-.081c.357-.357.358-.927 0-1.285-.354-.354-.932-.353-1.285 0l-.643.643-.643.643-.643.643c-.354.354-.354.931 0 1.285l-.643.643-.643.643z" sketch:type="MSShapeGroup" fill="#000"/></svg></symbol><symbol id="rte-table"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-table</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><rect sketch:type="MSShapeGroup" width="12" height="2" rx="1"/><path d="M12 10c0 .552-.456 1-1.002 1h-9.995c-.554 0-1.002-.444-1.002-1h12z" sketch:type="MSShapeGroup"/><path d="M12 1.002v8.995c0 .554-.444 1.002-1 1.002v-11c.552 0 1 .456 1 1.002z" sketch:type="MSShapeGroup"/><path d="M0 1.002v8.995c0 .554.444 1.002 1 1.002v-11c-.552 0-1 .456-1 1.002z" sketch:type="MSShapeGroup"/><path d="M10.5 5h.5v-1h-10v1h9.5z" id="Line" sketch:type="MSShapeGroup"/><path d="M10.5 8h.5v-1h-10v1h9.5z" sketch:type="MSShapeGroup"/><path d="M4 9.5v.5h1v-8h-1v7.5zM7 9.5v.5h1v-8h-1v7.5z" sketch:type="MSShapeGroup"/></g></svg></symbol><symbol id="rte-image"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-image</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><path d="M12 10c0 .552-.456 1-1.002 1h-9.995c-.554 0-1.002-.444-1.002-1h12z" sketch:type="MSShapeGroup"/><path d="M12 1c0-.552-.456-1-1.002-1h-9.995c-.554 0-1.002.444-1.002 1h12z" sketch:type="MSShapeGroup"/><path d="M12 1.002v8.995c0 .554-.444 1.002-1 1.002v-11c.552 0 1 .456 1 1.002z" sketch:type="MSShapeGroup"/><path d="M0 1.002v8.995c0 .554.444 1.002 1 1.002v-11c-.552 0-1 .456-1 1.002z" sketch:type="MSShapeGroup"/><circle sketch:type="MSShapeGroup" cx="3.5" cy="3.5" r="1.5"/><path d="M5.463 7.951l-1.463-1.951-3 4h10v-4.2l-2-2.8-3.537 4.951z" sketch:type="MSShapeGroup"/></g></svg></symbol><symbol id="rte-camera"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-camera</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><rect sketch:type="MSShapeGroup" y="2" width="9" height="8" rx="1"/><path d="M12 3v6l-5-3 5-3z" sketch:type="MSShapeGroup"/></g></svg></symbol><symbol id="rte-clear"><svg xmlns="http://www.w3.org/2000/svg" xmlns:sketch="http://www.bohemiancoding.com/sketch/ns" width="12" height="12" viewBox="0 0 12 12"><title>rte-clear</title><desc>Created with Sketch.</desc><g sketch:type="MSArtboardGroup" fill="#000"><path d="M8.293 9.707l.707.707 1.414-1.414-.707-.707-6-6-.707-.707-1.414 1.414.707.707 6 6z" sketch:type="MSShapeGroup"/><path d="M12 6c0-3.314-2.686-6-6-6s-6 2.686-6 6 2.686 6 6 6 6-2.686 6-6zm-10 0c0-2.209 1.791-4 4-4s4 1.791 4 4-1.791 4-4 4-4-1.791-4-4z" sketch:type="MSShapeGroup"/></g></svg></symbol><symbol id="next-remove"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" enable-background="new 0 0 24 24"><path d="M19.5 22c-.2 0-.5-.1-.7-.3L12 14.9l-6.8 6.8c-.2.2-.4.3-.7.3-.2 0-.5-.1-.7-.3l-1.6-1.6c-.1-.2-.2-.4-.2-.6 0-.2.1-.5.3-.7L9.1 12 2.3 5.2C2.1 5 2 4.8 2 4.5c0-.2.1-.5.3-.7l1.6-1.6c.2-.1.4-.2.6-.2.3 0 .5.1.7.3L12 9.1l6.8-6.8c.2-.2.4-.3.7-.3.2 0 .5.1.7.3l1.6 1.6c.1.2.2.4.2.6 0 .2-.1.5-.3.7L14.9 12l6.8 6.8c.2.2.3.4.3.7 0 .2-.1.5-.3.7l-1.6 1.6c-.2.1-.4.2-.6.2z"/></svg></symbol><symbol id="next-photos-80"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80"><path d="M80 57.6l-4-18.7v-23.9c0-1.1-.9-2-2-2h-3.5l-1.1-5.4c-.3-1.1-1.4-1.8-2.4-1.6l-32.6 7h-27.4c-1.1 0-2 .9-2 2v4.3l-3.4.7c-1.1.2-1.8 1.3-1.5 2.4l5 23.4v20.2c0 1.1.9 2 2 2h2.7l.9 4.4c.2.9 1 1.6 2 1.6h.4l27.9-6h33c1.1 0 2-.9 2-2v-5.5l2.4-.5c1.1-.2 1.8-1.3 1.6-2.4zm-75-21.5l-3-14.1 3-.6v14.7zm62.4-28.1l1.1 5h-24.5l23.4-5zm-54.8 64l-.8-4h19.6l-18.8 4zm37.7-6h-43.3v-51h67v51h-23.7zm25.7-7.5v-9.9l2 9.4-2 .5zm-52-21.5c-2.8 0-5-2.2-5-5s2.2-5 5-5 5 2.2 5 5-2.2 5-5 5zm0-8c-1.7 0-3 1.3-3 3s1.3 3 3 3 3-1.3 3-3-1.3-3-3-3zm-13-10v43h59v-43h-59zm57 2v24.1l-12.8-12.8c-3-3-7.9-3-11 0l-13.3 13.2-.1-.1c-1.1-1.1-2.5-1.7-4.1-1.7-1.5 0-3 .6-4.1 1.7l-9.6 9.8v-34.2h55zm-55 39v-2l11.1-11.2c1.4-1.4 3.9-1.4 5.3 0l9.7 9.7c-5.2 1.3-9 2.4-9.4 2.5l-3.7 1h-13zm55 0h-34.2c7.1-2 23.2-5.9 33-5.9l1.2-.1v6zm-1.3-7.9c-7.2 0-17.4 2-25.3 3.9l-9.1-9.1 13.3-13.3c2.2-2.2 5.9-2.2 8.1 0l14.3 14.3v4.1l-1.3.1z"/></svg></symbol><symbol id="next-checkmark"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" enable-background="new 0 0 24 24"><path d="M23.6 5L22 3.4c-.5-.4-1.2-.4-1.7 0L8.5 15l-4.8-4.7c-.5-.4-1.2-.4-1.7 0L.3 11.9c-.5.4-.5 1.2 0 1.6l7.3 7.1c.5.4 1.2.4 1.7 0l14.3-14c.5-.4.5-1.1 0-1.6z"/></svg></symbol><symbol id="next-chevron-down"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" enable-background="new 0 0 24 24"><path d="M21 5.176l-9.086 9.353-8.914-9.353-2.314 2.471 11.314 11.735 11.314-11.735-2.314-2.471z"/></svg></symbol><symbol id="next-calendar"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" enable-background="new 0 0 24 24"><path d="M21 3h-1V2c0-1.1-.9-2-2-2s-2 .9-2 2v1H8V2c0-1.1-.9-2-2-2S4 .9 4 2v1H3C1.3 3 0 4.3 0 6v15c0 1.7 1.3 3 3 3h18c1.7 0 3-1.3 3-3V6c0-1.7-1.3-3-3-3zM3 21V10h18v11H3z"/></svg></symbol><symbol id="next-arrow-double-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M11.5 6.5l-3.5-3.4-3.5 3.4-1-1 4.5-4.6 4.5 4.5-1 1.1zm1 4l-1.1-1.1-3.4 3.5-3.5-3.4-1.1 1.1 4.6 4.5 4.5-4.6z"/></svg></symbol><symbol id="next-add-circle"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 12 12"><path d="M6 0c-3.3 0-6 2.7-6 6s2.7 6 6 6 6-2.7 6-6-2.7-6-6-6zm3 7h-2v2c0 .5-.5 1-1 1s-1-.5-1-1v-2h-2c-.5 0-1-.5-1-1s.5-1 1-1h2v-2c0-.5.5-1 1-1s1 .5 1 1v2h2c.5 0 1 .5 1 1s-.5 1-1 1z"/></svg></symbol><symbol id="next-website"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="M9.4 2c-.2 0-.3.3-.2.4l1.4 1.4-3.8 3.9c-.2.2-.2.6 0 .8l.8.8c.2.2.6.2.8 0l3.8-3.8 1.4 1.4c.2.2.4 0 .4-.2v-4.2c0-.3-.2-.5-.5-.5h-4.1zm.6 0h-6c-1.1 0-2 .9-2 2v8c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2v-6 2h-2v3c0 .6-.5 1-1 1h-6c-.6 0-1-.5-1-1v-6c0-.6.5-1 1-1h3v-2h2z"/></svg></symbol><symbol id="next-search-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><path d="M0 5.667c0 3.125 2.542 5.667 5.667 5.667 1.202 0 2.315-.38 3.233-1.02l.455.456c-.07.5.082 1.025.466 1.41l3.334 3.332c.326.325.753.488 1.18.488.425 0 .852-.163 1.177-.488.652-.65.652-1.706 0-2.357L12.18 9.822c-.384-.384-.91-.536-1.41-.466l-.454-.456c.64-.918 1.02-2.03 1.02-3.233C11.333 2.542 8.79 0 5.666 0S0 2.542 0 5.667zm2 0C2 3.645 3.645 2 5.667 2s3.667 1.645 3.667 3.667-1.646 3.666-3.667 3.666S2 7.688 2 5.667z"/></svg></symbol><symbol id="next-info"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" enable-background="new 0 0 24 24"><g><path d="M13.5 7h-2c-.8 0-1.5.7-1.5 1.5v14c0 .8.7 1.5 1.5 1.5h2c.8 0 1.5-.7 1.5-1.5v-14c0-.8-.7-1.5-1.5-1.5z"/><circle cx="12.5" cy="2.5" r="2.5"/></g></svg></symbol><symbol id="next-dashboard-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><g><path d="M8.43 3.445c-.248-.21-.612-.21-.86 0L2.353 7.86C2.13 8.05 2 8.33 2 8.624v6.71c0 .366.3.666.667.666h2.667C5.7 16 6 15.7 6 15.333v-3c0-.183.15-.333.333-.333h3.333c.184 0 .334.15.334.333v3c0 .367.3.667.667.667h2.667c.366 0 .666-.3.666-.667v-6.71c0-.294-.13-.573-.354-.763L8.43 3.445zM15.764 6.158L8.944.39C8.692.14 8.357 0 8 0c-.357 0-.692.14-.902.354L.236 6.158c-.28.238-.316.66-.078.94.132.156.32.236.51.236.15 0 .304-.052.43-.158L7.6 1.638c.238-.178.56-.18.797-.003 1.468 1.1 6.505 5.54 6.505 5.54.28.237.702.203.94-.078.238-.28.203-.7-.078-.94z"/></g></svg></symbol><symbol id="next-orders-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><g><path d="M13.992 0H2.1C.94 0 0 .94 0 2.1v12.244C0 15.305.785 16 1.75 16H14.34c.964 0 1.658-.694 1.658-1.658V2.1C16 .94 15.15 0 13.992 0zM14 2v8h-1.757C11.28 10 10 11.28 10 12.243v.7c0 .193.337.057.144.057H5.247c-.193 0-.247.136-.247-.057v-.7C5 11.28 4.113 10 3.148 10H2V2h12zM7.117 9.963c.167.16.437.16.603.002l5.17-5.042c.165-.16.165-.422 0-.583l-.604-.583c-.166-.16-.437-.16-.603 0L7.42 7.924 5.694 6.24c-.166-.16-.437-.16-.603 0l-.604.582c-.166.162-.166.423 0 .584l2.63 2.557z"/></g></svg></symbol><symbol id="next-chevron"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M10.6,6 L8.2,8 L12,12 L8.2,16 L10.6,18 L15.3,13 C15.8,12.4 15.8,11.6 15.3,11 L10.6,6 L10.6,6 Z"/></svg></symbol><symbol id="next-products-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><path d="M15.087 0H10.01c-.554 0-1.085.235-1.476.627L.3 8.87c-.37.368-.37.965 0 1.327l5.553 5.556c.362.368.955.37 1.323 0L15.4 7.52c.39-.392.6-.922.6-1.476V.967C16 .45 15.604 0 15.087 0zm-2.89 5.56c-.94 0-1.702-.764-1.702-1.703 0-.94.763-1.702 1.702-1.702.94 0 1.702.763 1.702 1.702 0 .94-.764 1.702-1.703 1.702z"/></svg></symbol><symbol id="next-customers-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><g><path d="M13.08 8.26c-.68-.275-.674-.732-.674-1.007 0-.274.29-.657.566-.903.48-.423.777-1.04.777-1.737 0-1.206-1.018-2.21-2.224-2.257-.896-.03-1.658.41-2.062 1.1-.088.15-.03.337.127.415 1.12.555 1.873 1.69 1.873 3.03 0 .87-.32 1.698-.894 2.332-.128.14-.077.362.094.442.663.31 2.044.745 2.598 1.462.055.07.134-.136.224-.136h1.657c.473 0 .857.116.857-.358v-.12c0-1.308-1.93-1.85-2.92-2.263zM5.398 9.232c-.542-.603-.827-1.39-.827-2.304 0-1.348.74-2.53 1.863-3.08.16-.077.22-.267.128-.418-.5-.816-1.523-1.265-2.634-.993-1.006.24-1.64 1.17-1.64 2.21 0 .698.223 1.28.71 1.704.273.247.6.63.6.904s-.035.73-.715 1.006C1.89 8.67 0 9.214 0 10.522v.12c0 .474.384.358.857.358h1.656c.09 0 .17.206.226.133.544-.716 1.905-1.277 2.56-1.59.167-.078.222-.173.098-.31zM9.867 10.546c-.68-.278-.78-.735-.78-1.006 0-.274.234-.656.508-.9.483-.426.754-1.046.754-1.74 0-1.492-1.39-2.55-2.957-2.184-1.018.237-1.672 1.168-1.672 2.212 0 .695.223 1.286.706 1.71.274.246.596.628.596.902 0 .27-.248.728-.927 1.006C5.11 10.954 3 11.5 3 12.806v.122C3 13.4 3.812 14 4.286 14h7.43c.472 0 1.284-.6 1.284-1.072v-.122c0-1.307-2.147-1.852-3.133-2.26z"/></g></svg></symbol><symbol id="next-reports-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><g><path d="M4 9.667C4 9.297 3.702 9 3.333 9H1.667C1.297 9 1 9.298 1 9.667v5.667c0 .368.298.666.667.666h1.667c.368 0 .666-.298.666-.667V9.667zM8 3.667C8 3.297 7.702 3 7.333 3H5.667C5.297 3 5 3.298 5 3.667v11.667c0 .368.298.666.667.666h1.667c.368 0 .666-.298.666-.667V3.667zM12 .667c0-.37-.298-.667-.667-.667H9.667C9.297 0 9 .298 9 .667v14.667c0 .368.298.666.667.666h1.667c.368 0 .666-.298.666-.667V.667zM16 6.667c0-.37-.298-.667-.667-.667h-1.667c-.368 0-.666.298-.666.667v8.667c0 .368.298.666.667.666h1.667c.368 0 .666-.298.666-.667V6.667z"/></g></svg></symbol><symbol id="next-discounts-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><g><path d="M9 13.333C9 13.15 8.85 13 8.667 13H6.333c-.184 0-.333.15-.333.333v.333c0 .185.15.334.333.334h2.333c.185 0 .334-.15.334-.333v-.334zM13 13.333c0-.184-.15-.333-.333-.333h-2.333c-.185 0-.334.15-.334.333v.333c0 .185.15.334.333.334h2.333c.185 0 .334-.15.334-.333v-.334zM16 8.333C16 8.15 15.85 8 15.667 8h-.333c-.185 0-.334.15-.334.333v2.333c0 .185.15.334.333.334h.333c.185 0 .334-.15.334-.333V8.333zM11.3 9.2L7.272 5.902 11.3 2.607l-.013-.016c-.692-.845-1.94-.97-2.786-.278l-2.808 2.3-1.18-.966c.096-.254.155-.526.155-.813C4.667 1.547 3.62.5 2.333.5S0 1.547 0 2.833s1.047 2.333 2.333 2.333c.255 0 .495-.05.725-.127l1.055.862-.93.763c-.265-.103-.55-.165-.85-.165C1.047 6.5 0 7.547 0 8.833s1.047 2.333 2.333 2.333 2.333-1.047 2.333-2.333c0-.246-.05-.478-.12-.7l1.145-.938L8.5 9.493c.846.692 2.094.568 2.786-.28L11.3 9.2zM1.333 2.832c0-.55.45-1 1-1s1 .45 1 1-.45 1-1 1-1-.448-1-1zm1 7c-.55 0-1-.45-1-1s.45-1 1-1 1 .45 1 1c0 .552-.448 1-1 1zM13 5.333C13 5.15 12.85 5 12.667 5h-2.333c-.185 0-.334.15-.334.333v.333c0 .185.15.334.333.334h2.333c.185 0 .334-.15.334-.333v-.334zM15.5 5h-1c-.276 0-.5 0-.5.5s.224.5.5.5h.5v.48c0 .275 0 .5.5.5s.5-.225.5-.5V5.5c0-.276-.063-.5-.5-.5zM3.5 14h1c.276 0 .5 0 .5-.5s-.224-.5-.5-.5H4v-.5c0-.276 0-.5-.5-.5s-.5.224-.5.5v.98c0 .275.062.52.5.52zM16 13.49v-1c0-.276 0-.5-.5-.5s-.5.224-.5.5V13h-.49c-.276 0-.5 0-.5.5s.224.5.5.5h.98c.276 0 .51-.073.51-.51z"/></g></svg></symbol><symbol id="next-online-store-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><path d="M8 0C3.6 0 0 3.6 0 8s3.6 8 8 8 8-3.6 8-8-3.6-8-8-8zm0 14.1c-3.4 0-6.1-2.7-6.1-6.1 0-.9.2-1.8.6-2.6v.3c0 .2.3.5.3.7 0 .3.2.5.4.7.3.1.6.2.8.4.2.2.4.3.7.2.2.2.1.4 0 .6-.2.2-.3.4-.3.5-.1.3-.1.6.2.8.2.1.3.3.3.5s.2.4.3.5c.4.2.4.6.5 1 .1.8.7 2 .9 1.6.2-.3.6-.9.8-1.1.1-.1.2-.2.2-.3.1-.2.2-.4.4-.5.1-.1.2-.2.2-.3 0-.4.2-.8.4-1.1.4-.5.2-.8-.4-1-.3-.1-.7-.3-1.1-.1v-.2c.1-.5 0-.6-.5-.8-.2-.2-.4-.3-.6-.4-.2-.1-.5 0-.8-.1-.3.1-.2-.4-.5-.5-.6-.6.3-.8.7-.6.1.1.5-.5 1.3-1 .2 0 .1-1 .3-1-1.7-1-2-1.4-2-1.4h-.2c.9-.6 2-.9 3.2-.9h.6l-.1.1s-.5.3.1 1c.2.2.7.8.6.9 0 .2 1.4-.1 1.6-.1.4 0 .3.6 0 .7 0 .1-1.8.3-1.9.3-.3.4-.3.3-.2.7 0 .2-.1.3-.1.6.2.2.4.5.6.8.3.3.5.8.8.7.1 0 .2-.1.4-.2.1.1.3.4.5.5-.1.3 0 .5.2.8.1.1 0 .8-.1.9-.1.2 0 .6.2 1s.7.4.9 0l.7-1.9c.2-.4.5-.7.9-.9l.3-.1V8c.1 3.4-2.6 6.1-6 6.1z"/></svg></symbol><symbol id="next-apps-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><path d="M12.383 9.734c.59.41.882 1.044.87 1.675-.004.29.357.43.563.226l1.894-1.894c.387-.387.387-1.015 0-1.402l-2.498-2.498c-.167-.167-.115-.463.11-.54.397-.133.76-.396 1.02-.798.432-.662.416-1.56-.04-2.204-.734-1.033-2.175-1.123-3.03-.268-.216.216-.37.47-.463.74-.08.23-.387.28-.56.108L7.767.397C7.38.01 6.75.01 6.364.397L4.472 2.29c-.215.214-.05.565.257.565.504 0 1.013.192 1.4.58.87.87.765 2.34-.316 3.06-.663.443-1.568.435-2.216-.028-.576-.412-.86-1.04-.855-1.664.01-.29-.355-.43-.56-.224L.29 6.47c-.387.388-.387 1.016 0 1.403l2.498 2.498c.167.168.115.464-.11.54-.397.134-.76.397-1.02.8-.432.66-.416 1.56.04 2.203.734 1.033 2.175 1.123 3.03.268.216-.215.37-.47.463-.74.08-.23.387-.28.56-.107l2.483 2.484c.387.387 1.015.387 1.402 0l1.892-1.892c.215-.215.05-.564-.254-.563-.508 0-1.016-.193-1.404-.582-.86-.86-.768-2.304.278-3.037.658-.462 1.574-.466 2.235-.01z"/></svg></symbol><symbol id="next-settings-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><path d="M15.733 6.767l-1.77-.36c-.117-.025-.21-.112-.245-.227-.102-.323-.232-.636-.39-.935-.056-.107-.053-.234.013-.335l1-1.51c.086-.13.07-.304-.042-.415L13.02 1.707c-.114-.114-.292-.132-.426-.043l-1.504.995c-.1.066-.228.07-.335.013-.3-.158-.61-.288-.935-.39-.114-.037-.202-.13-.226-.247l-.36-1.77C9.2.113 9.063 0 8.906 0H7.093c-.158 0-.295.11-.326.267l-.36 1.77c-.025.117-.113.21-.227.245-.323.102-.636.232-.935.39-.107.056-.234.053-.335-.013l-1.504-.996c-.134-.09-.312-.07-.426.043L1.702 2.985c-.11.11-.128.284-.042.415l1 1.51c.066.1.07.228.012.335-.158.3-.288.612-.39.935-.036.114-.128.202-.246.226l-1.77.36C.113 6.8 0 6.937 0 7.094v1.813c0 .158.11.295.267.327l1.77.36c.117.025.21.112.245.227.102.323.232.636.39.935.056.107.053.234-.013.335l-.996 1.504c-.09.134-.07.312.043.426l1.273 1.273c.114.114.292.132.426.043l1.504-.995c.1-.066.228-.07.335-.012.3.158.61.288.935.39.115.036.202.128.226.246l.36 1.77c.032.155.17.266.327.266h1.813c.158 0 .295-.11.327-.267l.36-1.77c.025-.117.112-.21.227-.245.323-.102.636-.232.935-.39.107-.056.234-.053.335.013l1.504.996c.134.09.312.07.426-.043l1.273-1.273c.114-.114.132-.292.043-.426l-.995-1.504c-.066-.1-.07-.228-.012-.335.158-.3.288-.61.39-.935.036-.115.128-.202.246-.226l1.77-.36c.155-.032.266-.17.266-.327V7.093c0-.158-.112-.295-.267-.326zM10.667 8c0 1.473-1.193 2.667-2.667 2.667S5.333 9.473 5.333 8c0-1.473 1.193-2.667 2.667-2.667S10.667 6.527 10.667 8z"/></svg></symbol><symbol id="next-menu-16"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" enable-background="new 0 0 16 16"><path d="M7 9H1c-.552 0-1-.114-1-.667v-.666C0 7.114.448 7 1 7h14c.552 0 1 .114 1 .667v.667c0 .552-.448.666-1 .666H7zM7 4H1c-.552 0-1-.114-1-.667v-.666C0 2.114.448 2 1 2h14c.552 0 1 .114 1 .667v.667c0 .552-.448.666-1 .666H7zM7 14H1c-.552 0-1-.114-1-.667v-.667C0 12.114.448 12 1 12h14c.552 0 1 .114 1 .667v.667c0 .552-.448.666-1 .666H7z"/></svg></symbol></svg>
+</div>

data/app/views/layouts/admin/_nav_items.erb

@@ -0,0 +1,20 @@
+<li class="next-nav__item">
+  <a href="<%= admin_shops_path %>" class="next-nav__link <%= active_link_to_class(admin_shops_path, class_active: 'next-nav__link--is-selected', active: :inclusive) %>">
+    <svg class="next-icon next-icon--size-16 next-icon--no-nudge" role="img" aria-labelledby="next-dashboard-16-17dbedf316126bf9bd81f6c6b7626199-title"><title id="next-dashboard-16-17dbedf316126bf9bd81f6c6b7626199-title">Home</title><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#next-dashboard-16"></use></svg>
+    <span class="next-nav__text">Shops</span>
+  </a>
+</li>
+
+<li class="next-nav__item">
+  <a href="<%= admin_plans_path %>" class="next-nav__link <%= active_link_to_class(admin_plans_path, class_active: 'next-nav__link--is-selected', active: :inclusive) %>">
+    <svg class="next-icon next-icon--size-16 next-icon--no-nudge" role="img" aria-labelledby="next-dashboard-16-17dbedf316126bf9bd81f6c6b7626199-title"><title id="next-dashboard-16-17dbedf316126bf9bd81f6c6b7626199-title">Home</title><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#next-dashboard-16"></use></svg>
+    <span class="next-nav__text">Plans</span>
+  </a>
+</li>
+
+<li class="next-nav__item">
+  <a href="<%= edit_admin_app_settings_path %>" class="next-nav__link <%= active_link_to_class(edit_admin_app_settings_path, class_active: 'next-nav__link--is-selected', active: :inclusive) %>">
+    <svg class="next-icon next-icon--size-16 next-icon--no-nudge" role="img" aria-labelledby="next-dashboard-16-17dbedf316126bf9bd81f6c6b7626199-title"><title id="next-dashboard-16-17dbedf316126bf9bd81f6c6b7626199-title">Home</title><use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#next-dashboard-16"></use></svg>
+    <span class="next-nav__text">Settings</span>
+  </a>
+</li>

data/app/views/layouts/admin.html.erb

@@ -2,22 +2,66 @@
 <html>
 <head>
   <title><%= yield(:title) %></title>
-  <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
+  <%= stylesheet_link_tag 'disco_app/admin', media: 'all', 'data-turbolinks-track' => true %>
   <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
 
   <%= csrf_meta_tags %>
 </head>
-<body>
+<body class="next-ui">
 
-  <%= render 'layouts/admin/navbar' %>
+  <div class="nav-drawer">
+    <div class="next-nav next-nav--is-expanded">
+      <div class="next-nav__panel next-nav__panel--primary">
+        <header role="banner" class="next-nav__logo next-nav__logo--shopify">
+          <h1>
+            <a href="/admin">
+              <span role="img" class="ui-inline-svg">
+                <svg class="next-nav__svg-logo" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0" y="0" viewBox="0 0 609 177" xml:space="preserve" enable-background="new 0 0 609 177"><style type="text/css">
+                  .st0{fill:#231F20;}
+                  .st1{fill:#FBAF41;}
+                  .st2{fill:#8676D5;}
+                  .st3{fill:#9CCC6B;}
+                  .st4{fill:#FBCC6B;}
+                  .st5{fill:#9CCCD5;}
+                  .st6{fill:#FFFFFF;}
+                </style><path id="XMLID_36_" class="st0" d="M80.9 176l-37.2-21.5L6.4 133V90 47l37.2-21.5L80.9 4l37.2 21.5L155.4 47v43 43l-37.2 21.5L80.9 176z"/><polygon id="XMLID_13_" class="st1" points="16 52.5 16 127.5 145.9 127.5 "/><polygon id="XMLID_12_" class="st2" points="16 127.5 145.9 127.5 145.9 52.5 "/><polygon id="XMLID_11_" class="st3" points="145.9 127.5 80.9 15.1 16 127.5 "/><polygon id="XMLID_10_" class="st4" points="48.5 71.3 16 127.5 145.9 127.5 "/><polygon id="XMLID_9_" class="st5" points="16 127.5 145.9 127.5 113.4 71.3 "/><polygon id="XMLID_8_" class="st6" points="80.9 90 16 127.5 80.9 165 145.9 127.5 "/><g id="XMLID_17_"><path id="XMLID_27_" class="st6" d="M205.4 125.4V55h27.7c22 0 37.3 14 37.3 35.1 0 21.3-15.3 35.2-37.2 35.2H205.4zM255.2 90.2c0-12.3-7.6-21.9-21.9-21.9h-12.9v44h12.8C247.1 112.2 255.2 102.2 255.2 90.2z"/><path id="XMLID_25_" class="st6" d="M286.4 125.4V55h15v70.3H286.4z"/><path id="XMLID_23_" class="st6" d="M315.7 115.5l8.2-11.7c5 5.2 12.7 9.6 22.4 9.6 8.3 0 12.2-3.7 12.2-7.8 0-12.2-40.5-3.7-40.5-30.2 0-11.7 10.1-21.4 26.7-21.4 11.2 0 20.5 3.4 27.4 9.8L363.8 75c-5.7-5.3-13.3-7.7-20.5-7.7 -6.3 0-9.9 2.7-9.9 7 0 11.1 40.4 3.6 40.4 29.8 0 12.9-9.3 22.6-28.2 22.6C332.1 126.7 322.4 122.1 315.7 115.5z"/><path id="XMLID_21_" class="st6" d="M385.8 90.3c0-21.7 16.3-36.4 37.5-36.4 15.4 0 24.4 8.3 29.3 17.2l-12.9 6.3c-3-5.7-9.3-10.2-16.5-10.2 -12.9 0-22.1 9.8-22.1 23.1 0 13.3 9.3 23.1 22.1 23.1 7.2 0 13.5-4.5 16.5-10.2l12.9 6.2c-5 8.8-13.9 17.3-29.3 17.3C402.1 126.7 385.8 111.9 385.8 90.3z"/><path id="XMLID_18_" class="st6" d="M463.5 90.3c0-21.2 15.5-36.4 36.8-36.4 21.2 0 36.7 15.2 36.7 36.4 0 21.2-15.5 36.4-36.7 36.4C479 126.7 463.5 111.5 463.5 90.3zM521.6 90.3c0-13.2-8.3-23.1-21.3-23.1 -13.1 0-21.4 9.9-21.4 23.1 0 13.1 8.3 23.1 21.4 23.1C513.2 113.4 521.6 103.3 521.6 90.3z"/></g></svg>
+              </span>
+            </a>
+          </h1>
+        </header>
+        <nav role="navigation">
+          <ol class="next-nav__list next-nav__list--primary">
+            <%= render 'layouts/admin/nav_items' %>
+          </ol>
+        </nav>
+      </div>
+    </div>
+  </div>
 
-  <div class="container-fluid">
-    <% flash.each do |message_type, message| %>
-        <div class="alert alert-<%= message_type %>"><%= message %></div>
-    <% end %>
+  <main id="content" role="main">
+    <div class="header-row">
+      <header class="header">
+        <h1 class="header__main">
+          <svg class="next-icon next-icon--size-20 next-icon--header">
+            <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#next-collections"></use>
+          </svg>
+          <% if content_for?(:breadcrumb) %>
+          <span class="breadcrumb">
+            <a href="<%= yield(:breadcrumb_url) %>"><%= yield(:breadcrumb) %></a>
+            /
+          </span>
+          <% end %>
+          <span>
+            <%= yield(:title) %>
+          </span>
+        </h1>
+      </header>
+    </div>
 
-    <%= yield %>
-  </div>
+    <div class="page">
+      <%= yield %>
+    </div>
+  </main>
 
 </body>
 </html>

data/app/views/layouts/embedded_app.html.erb

@@ -37,5 +37,7 @@
   <% end %>
 
   <%= javascript_include_tag 'application', 'data-turbolinks-track' => true, 'data-turbolinks-eval' => false %>
+
+  <%= render 'disco_app/shared/icons' %>
 </body>
 </html>

data/app/views/layouts/embedded_app_modal.html.erb

@@ -2,7 +2,18 @@
 <html>
 <head>
   <title><%= yield(:title) %></title>
+  <script src="//cdn.shopify.com/s/assets/external/app.js?<%= Time.now.strftime('%Y%m%d%H') %>"></script>
+  <script type="text/javascript">
+    // Initialise the Shopify App.
+    ShopifyApp.init({
+      "apiKey": "<%= ShopifyApp.configuration.api_key %>",
+      "shopOrigin": "<%= "https://#{ @shop_session.url }" if @shop_session %>",
+      "debug": <%= Rails.env.development? ? 'true' : 'false' %>,
+      "forceRedirect": false
+    });
+  </script>
 
+  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
   <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
 
   <%= csrf_meta_tags %>

data/config/routes.rb

@@ -26,11 +26,13 @@ DiscoApp::Engine.routes.draw do
   end
 
   namespace :admin do
-    resources :shops, only: [:index, :edit, :update]
+    resources :shops, only: [:index, :edit, :update] do
+      resources :subscriptions, only: [:edit, :update]
+    end
     resources :plans
     resource :app_settings, only: [:edit, :update]
 
-    # JSON-API resources for admins."
+    # JSON-API resources for admins.
     namespace :resources do
       jsonapi_resources :shops
     end