diff --git a/app/views/console/database/collection.phtml b/app/views/console/database/collection.phtml
index 1ac1454f5c..b2b35fa1e2 100644
--- a/app/views/console/database/collection.phtml
+++ b/app/views/console/database/collection.phtml
@@ -88,11 +88,12 @@
                                 </thead>
                                 <tbody data-ls-loop="project-documents.documents" data-ls-as="node">
                                     <tr data-ls-loop="project-collection.rules" data-ls-as="rule">
-                                        <td data-ls-attrs="data-title={{rule.label}}:" class="text-size-small">
+                                        <td data-ls-attrs="data-title={{rule.label}}:" class="text-size-small text-height-small">
                                             <a data-ls-attrs="href=/console/database/document?id={{node.$id}}&collection={{router.params.id}}&project={{router.params.project}}">
-                                                <span data-ls-if="{{rule.type}} !== 'document'" data-ls-bind="{{node|documentLabel}}"></span>
-                                                <span data-ls-if="{{rule.type}} == 'document' && {{rule.array}}">[]</span>
+                                                <span data-ls-if="{{rule.type}} !== 'document' && {{rule.type}} !== 'fileId'" data-ls-bind="{{node|documentLabel}}"></span>
+                                                <span data-ls-if="{{rule.type}} == 'document' && {{rule.array}}">[...]</span>
                                                 <span data-ls-if="{{rule.type}} == 'document' && !{{rule.array}}">{...}</span>
+                                                <img data-ls-if="{{rule.type}} == 'fileId' && !{{rule.array}} && {{node|documentLabel|isEmpty}}" src="" data-ls-attrs="src=//{{env.DOMAIN}}/v1/storage/files/{{node|documentLabel}}/preview?width=65&height=65&project={{router.params.project}}&mode=admin" class="avatar" width="30" height="30" loading="lazy" />
                                             </a>
                                         </th>
                                     </tr>
@@ -156,7 +157,7 @@
 
                             <label>&nbsp;</label>
 
-                            <div class="box margin-bottom">
+                            <div class="box">
                                 <label for="collection-name">Name</label>
                                 <input name="name" id="collection-name" type="text" autocomplete="off" data-ls-bind="{{project-collection.name}}" data-forms-text-direction required placeholder="Collection Name" />
                                 
@@ -244,6 +245,10 @@
                                                             <option value="markdown">Markdown</option>
                                                             <option value="document">Document</option>
                                                         </optgroup>
+                                                        <optgroup label="Links">
+                                                            <option value="fileId">File ID</option>
+                                                            <option value="documentId">Document ID</option>
+                                                        </optgroup>
                                                     </select>
                                                         
                                                     <div class="margin-bottom">
@@ -257,7 +262,9 @@
                                                     <div data-ls-template="template-validation-{{rule.type}}" data-type="script" class="margin-bottom"></div>
                                                 </fieldset>
 
-                                                <button type="button" data-remove="" class="reverse danger margin-bottom">Remove</button>
+                                                <button type="button" data-ls-ui-trigger="splice-rule-{{$index}}" class="reverse danger margin-bottom">Remove</button>
+
+                                                <!-- <button type="button" data-remove="" class="reverse danger margin-bottom">Remove</button> -->
                                             </div>
                                         </li>
                                     </ul>
@@ -317,6 +324,24 @@
                     </div>
                 </div>
 
+                <ul data-ls-loop="project-collection.rules" data-ls-as="rule" class="sortable">
+                    <li data-forms-remove data-forms-move-up  data-forms-move-down>
+                        <form
+                            data-analytics-event="splice-rule-{{$index}}"
+                            data-analytics-category="console"
+                            data-analytics-label="Spliced Collection Rule"
+                            data-service="container.path"
+                            data-event="splice-rule-{{$index}}"
+                            data-scope="window.ls"
+                            data-success="reset">
+
+                            <input type="hidden" name="path" value="project-collection.rules" />
+                            <input type="hidden" name="type" value="splice" />
+                            <input type="hidden" name="value" data-ls-bind="{{$index}}" />
+                        </form>
+                    </li>
+                </ul>
+
                 <div data-ui-modal class="box modal close" data-button-alias="none" data-open-event="add-rule">
                     <button type="button" class="close pull-end" data-ui-modal-close=""><i class="icon-cancel"></i></button>
 
@@ -371,6 +396,10 @@
                                     <option value="markdown">Markdown</option>
                                     <option value="document">Document</option>
                                 </optgroup>
+                                <optgroup label="Links">
+                                        <option value="fileId">File ID</option>
+                                        <option value="documentId">Document ID</option>
+                                </optgroup>
                             </select>
                             
                             <input name="default" type="hidden" value="" />
@@ -442,7 +471,7 @@
 <script type="text/html" id="template-validation-document-array-true">
     <label data-ls-attrs="for=rule-list-{{rule.$id}}" class="margin-bottom">Allowed Collections</label>
 
-    <div data-ls-loop="project-collections.collections" data-ls-as="project" class="tiles cell-3 margin-bottom-negative" style="visibility: hidden">
+    <div data-ls-loop="project-collections.collections" data-ls-as="project" data-ls-key="$index2" class="tiles cell-3 margin-bottom-negative" style="visibility: hidden">
         <div class="margin-bottom" data-ls-if="{{project.$id}} != {{router.params.id}}">
             <input type="checkbox" name="list" data-ls-attrs="value={{project.$id}}" data-ls-bind="{{rule.list}}" /> <span data-ls-bind="{{project.name}}"></span>
         </div>
@@ -452,7 +481,7 @@
 <script type="text/html" id="template-validation-document-array-false">
     <label data-ls-attrs="for=rule-list-{{rule.$id}}" class="margin-bottom">Allowed Collection</label>
 
-    <div data-ls-loop="project-collections.collections" data-ls-as="project" class="tiles cell-3 margin-bottom-negative" style="visibility: hidden">
+    <div data-ls-loop="project-collections.collections" data-ls-as="project" data-ls-key="$index2" class="tiles cell-3 margin-bottom-negative" style="visibility: hidden">
         <div class="margin-bottom" data-ls-if="{{project.$id}} != {{router.params.id}}">
             <input type="radio" name="list" data-ls-attrs="value={{project.$id}}" data-ls-bind="{{rule.list|firstElement}}" data-cast-to="array" /> <span data-ls-bind="{{project.name}}"></span>
         </div>
diff --git a/app/views/console/database/document.phtml b/app/views/console/database/document.phtml
index 614af71951..47961abbb6 100644
--- a/app/views/console/database/document.phtml
+++ b/app/views/console/database/document.phtml
@@ -7,7 +7,98 @@ $collection = $this->getParam('collection', null);
 $db = $this->getParam('db', null);
 $rules = $collection->getAttribute('rules', []);
 $namespace = 'project-document';
+$collections = [];
 ?>
+
+<?php foreach($rules as $rule):
+    $key = (isset($rule['key'])) ? $rule['key'] : '';
+    $label = (isset($rule['label'])) ? $rule['label'] : '';
+    $type = (isset($rule['type'])) ? $rule['type'] : '';
+    $list = (isset($rule['list'])) ? $rule['list'] : false;
+    $array = (isset($rule['array'])) ? $rule['array'] : false;
+
+    if($type !== 'document') {
+        continue;
+    }
+?>
+    <?php foreach($list as $item):
+        if($item === $collection->getId()) {
+            continue; // Do not allow rec recrusion
+        }
+
+        Authorization::disable(); //TODO Try and avoid calling the DB from the template
+        $childCollection = $db->getDocument($item, false);
+        Authorization::reset();
+
+        if(!$childCollection->getId()) {
+            continue;
+        }
+
+        $collections[$childCollection->getId()] = $childCollection->getAttribute('name');
+    ?>
+        <form class="margin-bottom-no"
+            data-analytics-event="submit"
+            data-analytics-category="console"
+            data-analytics-label="Added Child Document"
+            data-service="container.path"
+            data-event="collection-child-<?php echo $this->escape($namespace.'.'.$key); ?>-<?php echo $this->escape($childCollection->getId()); ?>"
+            data-scope="window.ls"
+            data-success="reset">
+
+            <input type="hidden" name="path" value="<?php echo $this->escape($namespace.'.'.$key); ?>" />
+            <input type="hidden" name="type" value="append" />
+            
+            <fieldset name="value" data-cast-to="object">                            
+                <input name="$id" type="hidden" value="" />
+                <input name="$collection" type="hidden" value="<?php echo $this->escape($childCollection->getId()); ?>" />
+            </fieldset>
+        </form>
+
+        <script type="text/html" id="collection-<?php echo ($array) ? 'array-' : ''; ?><?php echo $this->escape($childCollection->getId()); ?>">
+            <?php 
+
+            $comp = new View(__DIR__.'/form.phtml');
+                                        
+            $comp
+                ->setParam('collection', $childCollection)
+                ->setParam('namespace', ($array) ? 'node' : $namespace.'.'.$key)
+                ->setParam('key', $key)
+                ->setParam('array', $array)
+                ->setParam('parent', 0)
+            ;
+
+            echo $comp->render();
+            ?>
+        </script>
+    <?php endforeach; ?>
+<?php endforeach; ?>
+
+<?php foreach($rules as $rule):
+    $key = (isset($rule['key'])) ? $rule['key'] : '';
+    $label = (isset($rule['label'])) ? $rule['label'] : '';
+    $type = (isset($rule['type'])) ? $rule['type'] : '';
+    $list = (isset($rule['list'])) ? $rule['list'] : false;
+    $array = (isset($rule['array'])) ? $rule['array'] : false;
+
+    if(!$array) {
+        continue;
+    }
+?>
+    <ul data-ls-loop="<?php echo $this->escape($namespace.'.'.$key); ?>" data-ls-as="xxx">
+        <li>
+            <form
+                data-service="container.path"
+                data-event="splice-<?php echo $this->escape($namespace.'.'.$key); ?>-{{$index}}"
+                data-scope="window.ls"
+                data-success="reset">
+
+                <input type="hidden" name="path" value="<?php echo $this->escape($namespace.'.'.$key); ?>" />
+                <input type="hidden" name="type" value="splice" />
+                <input type="hidden" name="value" data-ls-bind="{{$index}}" />
+            </form>
+        </li>
+    </ul>
+<?php endforeach; ?>
 <div
     data-service="database.getCollection"
     data-param-collection-id="{{router.params.collection}}"
@@ -47,7 +138,7 @@ $namespace = 'project-document';
             <button data-ui-modal-close="" type="button" class="reverse">Cancel</button>
         </div>
 
-        <div class="zone xl">
+        <div class="zone xl margin-bottom-no">
             <ul class="phases clear" data-ui-phases data-selected="{{router.params.tab}}">
                 <li data-state="/console/database/document?id={{router.params.id}}&collection={{router.params.collection}}&project={{router.params.project}}">
                     <h2>Update</h2>
@@ -84,6 +175,7 @@ $namespace = 'project-document';
                             
                                         $comp
                                             ->setParam('collection', $collection)
+                                            ->setParam('collections', $collections)
                                             ->setParam('namespace', $namespace)
                                             ->setParam('key', 'data')
                                             ->setParam('parent', 1)
@@ -127,7 +219,7 @@ $namespace = 'project-document';
                             </div>
 
                             <ul class="margin-bottom-large text-fade text-size-small">
-                            <li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> <button data-ls-ui-trigger="open-json" class="link text-size-small">View as JSON</button></li>
+                                <li class="margin-bottom-small"><i class="icon-angle-circled-right margin-start-tiny margin-end-tiny"></i> <button data-ls-ui-trigger="open-json" class="link text-size-small">View as JSON</button></li>
                             </ul>
 
                             <div data-ls-if="({{project-document.$id}})">
@@ -160,47 +252,4 @@ $namespace = 'project-document';
             </ul>
         </div>
     </div>
-</div>
-
-<?php foreach($rules as $rule):
-    $key = (isset($rule['key'])) ? $rule['key'] : '';
-    $label = (isset($rule['label'])) ? $rule['label'] : '';
-    $type = (isset($rule['type'])) ? $rule['type'] : '';
-    $list = (isset($rule['list'])) ? $rule['list'] : false;
-    $array = (isset($rule['array'])) ? $rule['array'] : false;
-
-    if($type !== 'document') {
-        continue;
-    }
-?>
-    <?php foreach($list as $item):
-        if($item === $collection->getId()) {
-            continue; // Do not allow rec recrusion
-        }
-
-        Authorization::disable(); //TODO Try and avoid calling the DB from the template
-        $childCollection = $db->getDocument($item, false);
-        Authorization::reset();
-
-        if(!$childCollection->getId()) {
-            continue;
-        }
-    ?>
-        <script type="text/html" id="collection-<?php echo ($array) ? 'array-' : ''; ?><?php echo $this->escape($childCollection->getId()); ?>">
-            <?php 
-
-            $comp = new View(__DIR__.'/form.phtml');
-                                        
-            $comp
-                ->setParam('collection', $childCollection)
-                ->setParam('namespace', ($array) ? 'node' : $namespace.'.'.$key)
-                ->setParam('key', $key)
-                ->setParam('array', $array)
-                ->setParam('parent', 0)
-            ;
-
-            echo $comp->render();
-            ?>
-        </script>
-    <?php endforeach; ?>
-<?php endforeach; ?>
\ No newline at end of file
+</div>
\ No newline at end of file
diff --git a/app/views/console/database/form.phtml b/app/views/console/database/form.phtml
index 64911d2036..59ce352763 100644
--- a/app/views/console/database/form.phtml
+++ b/app/views/console/database/form.phtml
@@ -3,6 +3,7 @@
 use Utopia\View;
 
 $collection = $this->getParam('collection', null);
+$collections = $this->getParam('collections', []);
 $rules = $collection->getAttribute('rules', []);
 $key = $this->getParam('key', null);
 $parent = $this->getParam('parent', true);
@@ -24,7 +25,7 @@ $array = $this->getParam('array', false);
 </div> */ ?>
 <?php endif; ?>
 
-<fieldset name="<?php echo $this->escape($key); ?>"<?php if(!$array): ?> data-cast-to="object"<?php endif; ?>>
+<fieldset name="<?php echo $this->escape($key); ?>"<?php if(!$array): ?> data-cast-to="object"<?php endif; ?> class="<?php if($type === 'document'): ?> info<?php endif; ?>">
     <?php if(!$parent): ?>
     <input name="$id" type="hidden" data-ls-bind="{{<?php echo $this->escape($namespace); ?>.$id}}" />
     <input name="$collection" type="hidden" data-ls-bind="<?php echo $this->escape($collection->getId()); ?>" />
@@ -58,10 +59,11 @@ $array = $this->getParam('array', false);
                 ->setParam('list', $list)
                 ->setParam('namespace', $namespace.'.'.$key)
                 ->setParam('comp', $comp)
+                ->setParam('collections', $collections)
             ;
             ?>
         <li>
-            <label class="margin-bottom-no">
+        <label class="margin-bottom-no<?php if($type === 'document'): ?> margin-top-large<?php endif; ?>">
                 <?php echo $this->escape($label); ?>
 
                 <?php if($array): ?>
@@ -69,11 +71,11 @@ $array = $this->getParam('array', false);
                 <?php endif; ?>
 
                 <?php if($required): ?>
-                    <span class="text-size-xs text-danger text-fade">&nbsp;required</span>
+                    <div class="text-size-xs text-danger text-fade">&nbsp;required</div>
                 <?php endif; ?>
                 
                 <?php if(!$required): ?>
-                    <span class="text-size-xs text-fade">&nbsp;optional</span>
+                    <div class="text-size-xs text-fade">&nbsp;optional</div>
                 <?php endif; ?>
             </label>