Repository: mozmeao/snippets-service

Issue:
ASR Snippet Admin: Place Snippet ID on editing page
Currently we only see what the snippet id is in the URL, would like to see the Snippet ID on top of the editing page. (One thought is to replace or move the red Delete button and put Snippet ID there instead).


Discussion:
![screen shot 2018-10-25 at 10 43 00 am](https://user-images.githubusercontent.com/6807556/47519616-c1765900-d842-11e8-8fa2-38716861cdd3.png)

Placing things next to those buttons is a pain. 

I can put it above the snippet name and even apply styles to make more prominent (color, background) if you want. 

What do you think @jkt230 ?
sounds good!

Resolving patch:
diff --git a/snippets/base/admin/adminmodels.py b/snippets/base/admin/adminmodels.py
--- a/snippets/base/admin/adminmodels.py
+++ b/snippets/base/admin/adminmodels.py
@@ -137,6 +137,7 @@ class ASRSnippetAdmin(admin.ModelAdmin):
     )
     preserve_filters = True
     readonly_fields = (
+        'id',
         'created',
         'modified',
         'uuid',
@@ -152,7 +153,7 @@ class ASRSnippetAdmin(admin.ModelAdmin):
     )
 
     fieldsets = (
-        ('ID', {'fields': ('creator', 'name', 'status', 'preview_url')}),
+        ('ID', {'fields': ('id', 'name', 'status', 'creator', 'preview_url')}),
         ('Content', {
             'description': (
                 '''
@@ -182,7 +183,10 @@ class ASRSnippetAdmin(admin.ModelAdmin):
 
     class Media:
         css = {
-            'all': ('css/admin/ASRSnippetAdmin.css',)
+            'all': (
+                'css/admin/ASRSnippetAdmin.css',
+                'css/admin/IDFieldHighlight.css',
+            )
         }
         js = (
             'js/admin/clipboard.min.js',
diff --git a/snippets/base/admin/legacy.py b/snippets/base/admin/legacy.py
--- a/snippets/base/admin/legacy.py
+++ b/snippets/base/admin/legacy.py
@@ -28,7 +28,7 @@ class BaseSnippetAdmin(VersionAdmin, admin.ModelAdmin):
     list_editable = (
         'published',
     )
-    readonly_fields = ('created', 'modified', 'uuid')
+    readonly_fields = ('id', 'created', 'modified', 'uuid')
     save_on_top = True
     save_as = True
 
@@ -79,7 +79,7 @@ class SnippetAdmin(QuickEditAdmin, BaseSnippetAdmin):
                          ('exclude_from_search_providers', 'client_match_rules'))
 
     fieldsets = (
-        (None, {'fields': ('creator', 'name', ('ready_for_review', 'published'), 'campaign',
+        (None, {'fields': ('id', 'creator', 'name', ('ready_for_review', 'published'), 'campaign',
                            'preview_url', 'created', 'modified')}),
         ('Content', {
             'description': ('In Activity Stream Templates you can use the special links:<br/>'
@@ -148,7 +148,10 @@ class SnippetAdmin(QuickEditAdmin, BaseSnippetAdmin):
 
     class Media:
         css = {
-            'all': ('css/admin.css',)
+            'all': (
+                'css/admin.css',
+                'css/admin/IDFieldHighlight.css',
+            )
         }
 
     def get_form(self, request, obj=None, **kwargs):
@@ -192,7 +195,7 @@ class JSONSnippetAdmin(BaseSnippetAdmin):
     )
 
     fieldsets = (
-        (None, {'fields': ('name', 'published', 'created', 'modified')}),
+        (None, {'fields': ('id', 'name', 'published', 'created', 'modified')}),
         ('Content', {
             'fields': ('icon', 'text', 'url'),
         }),
@@ -229,6 +232,14 @@ class JSONSnippetAdmin(BaseSnippetAdmin):
         }),
     )
 
+    class Media:
+        css = {
+            'all': (
+                'css/admin.css',
+                'css/admin/IDFieldHighlight.css',
+            )
+        }
+
     def save_model(self, request, obj, form, change):
         statsd.incr('save.json_snippet')
         super(JSONSnippetAdmin, self).save_model(request, obj, form, change)


Test patch: