diff --git a/deletetemplate.php b/deletetemplate.php
new file mode 100644
index 0000000..20a471f
--- /dev/null
+++ b/deletetemplate.php
@@ -0,0 +1,37 @@
+<?php
+require_once __DIR__."/vendor/autoload.php";
+require_once "root.php";
+require_once "resources/require.php";
+require_once "resources/check_auth.php";
+
+header("Content-Type: application/json");
+
+foreach ($_SESSION['user']['extension'] as $ext) {
+    if ($ext['extension_uuid'] == $_GET['extension_uuid']) {
+        $extension = $ext;
+        break;
+    }
+}
+
+
+if (!$extension) {
+    http_response_code(400);
+    echo json_encode(array("error" => "invalid or unauthorized extension"));
+    die();
+}
+    $database = new database;
+
+    $sql = "DELETE from webtexting_message_templates WHERE domain_uuid = :domain_uuid AND email_template_uuid = :template_uuid;";
+         $parameters['domain_uuid'] = $domain_uuid;
+         $parameters['template_uuid'] = $_GET['template_uuid'];
+         $deleted = $database->select($sql, $parameters, 'all');
+      if($deleted){
+          message::add("template deleted.");
+      } else {
+          message::add("error deleting template.", 'negative');
+      }
+      echo(json_encode($templates));
+      return json_encode($templates);
+//       unset($parameters);
+//         //do an edit template
+//         //$domain_uuid;
\ No newline at end of file
diff --git a/frontend/components/EmailForwardMenu/EmailForwardMenu.vue b/frontend/components/EmailForwardMenu/EmailForwardMenu.vue
new file mode 100644
index 0000000..9c28123
--- /dev/null
+++ b/frontend/components/EmailForwardMenu/EmailForwardMenu.vue
@@ -0,0 +1,67 @@
+<script lang="ts">
+import {emitter} from '../../lib/global';
+export default{
+    name:"ForwardingPlaceholder",
+    props:{
+        selectedConvo: Boolean,
+    },
+    data(){
+        return{
+            emailForwardFormInputs:{
+                phoneNumber:'',
+                emailAddress:''
+            }
+        }
+    },
+    methods: {
+        submitEmailForwardingRegisterRequest(){
+            event.preventDefault();
+            const params = {
+                email_address: this.$data.emailForwardFormInputs.emailAddress.trim(),
+                own_number: this.$data.emailForwardFormInputs.phoneNumber.trim()
+            }
+            emitter.emit("register-email-forwarding",params);
+        }
+    },
+}
+</script>
+<template>
+    <div id="NO_MESSAGES" >
+            <p v-if="!selectedConvo" class="center">  Forward new text messages to your Email</p>
+            <div class="template-form ">
+                <div class="mt-form-row">
+                    <div class="category-template-uuid">Your phone number</div>
+                    <div class="area-for-text"> <textarea v-model="emailForwardFormInputs.phoneNumber"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc">Email Address to forward messages to.</div>
+                    <div class="area-for-text"> <textarea v-model="emailForwardFormInputs.emailAddress"></textarea></div>
+
+                </div>
+                <button class="submit" @click="submitEmailForwardingRegisterRequest">Submit</button>
+                </div>
+    </div>
+</template>
+<style scoped>
+#NO_MESSAGES {
+    grid-column-start: 2;
+    grid-column-end: 2;
+    display: grid;
+    grid-template-columns: auto;
+    grid-template-rows: auto;
+}
+.center{
+    grid-column-start: 1;
+    grid-row-start: 1;
+    align-self: center;
+    justify-self: center;
+}
+
+@media screen and (width <=700px) {
+    #NO_MESSAGES{
+        display:none;
+    }
+}
+
+</style>
\ No newline at end of file
diff --git a/frontend/components/MenuList/MenuList.vue b/frontend/components/MenuList/MenuList.vue
index 6dc7909..2f59788 100644
--- a/frontend/components/MenuList/MenuList.vue
+++ b/frontend/components/MenuList/MenuList.vue
@@ -33,9 +33,8 @@ export default {
                 <h6 class="m-auto">Settings</h6>
             </div>
         </div>
-        <MenuPreview name="templates" link='templates.php' descriptions="Manage Message Templates" 
-                   ></MenuPreview>
-
+        <MenuPreview name="Templates" link='templates.php' descriptions="Manage Message Templates" ></MenuPreview>
+        <MenuPreview name="Email Forwarding" link='email_forwarding.php' descriptions="Manage Email Forwarding"></MenuPreview>
         <div class="threadlist-table">
             <div class="preview_list_container">
                 
diff --git a/frontend/components/MenuPreview/MenuPreview.vue b/frontend/components/MenuPreview/MenuPreview.vue
index 4abda61..f84b034 100644
--- a/frontend/components/MenuPreview/MenuPreview.vue
+++ b/frontend/components/MenuPreview/MenuPreview.vue
@@ -31,14 +31,9 @@ export default {
                 <div class="menu-preview-container" >
                     <span class='menu-name' >{{
                         this.name }}</span>
-                    <span class='timestamp' 
-                        :data-timestamp="this.timestamp"></span>
 
                     <span class='menu-last-message' >{{
                         this.description }}</span>
-                        <div class="new-messages">
-                            <span class="new-message-alert-dot bgc-AN-orange" v-if="newMessages>0">{{this.newMessages}}</span>
-                        </div>
                 </div>
 
 
@@ -108,13 +103,7 @@ export default {
     color: white;
 }
 
-.text-center {
-    margin: 0;
-    position: relative;
-    top: 50%;
-    -ms-transform: translateY(-50%);
-    transform: translateY(-50%);
-}
+
 
 .activeMenu {
     color: white;
diff --git a/frontend/components/PaginatorButton/PaginatorButton.vue b/frontend/components/PaginatorButton/PaginatorButton.vue
index fdede65..629cee8 100644
--- a/frontend/components/PaginatorButton/PaginatorButton.vue
+++ b/frontend/components/PaginatorButton/PaginatorButton.vue
@@ -6,7 +6,7 @@ export default{
     props:{
     },
     data(){
-        return {oldestMessage: state.oldestMessage,
+        return {
                 morePreviewsAvailable: true}
     },
     methods:{
@@ -32,7 +32,7 @@ export default{
 <template>
     <div class="paginator_container" >
         
-        <a id='MORE-PREVIEWS' class="paginator" role="button" v-if="this.morePreviewsAvailable" @click="paginatorClickFunction" :data-oldest-message="oldestMessage">
+        <a id='MORE-PREVIEWS' class="paginator" role="button" v-if="this.morePreviewsAvailable" @click="paginatorClickFunction" >
             <span class="paginator-link">Load More</span>
         </a>
 
diff --git a/frontend/components/SendBox/SendBox.vue b/frontend/components/SendBox/SendBox.vue
index 467e02c..2d3a539 100644
--- a/frontend/components/SendBox/SendBox.vue
+++ b/frontend/components/SendBox/SendBox.vue
@@ -359,6 +359,7 @@ export default {
             <button class="btn btn-send"
                 :disabled="(pendingAttachments.length == 0 && enteredText.length == 0 ) || !state.connected"
                 v-on:click="send"><span class="fas fa-paper-plane fa-fw"></span></button>
+                <button class="btn btn-send"><span class="fas">T</span></button>
         </div>
         <div class="char-counter-box">
             <div class="char-counter-display">{{ enteredText.length }} / 160</div>
diff --git a/frontend/components/TemplatePreview/TemplatePreview.vue b/frontend/components/TemplatePreview/TemplatePreview.vue
new file mode 100644
index 0000000..abea8d7
--- /dev/null
+++ b/frontend/components/TemplatePreview/TemplatePreview.vue
@@ -0,0 +1,113 @@
+<script lang='ts'>
+//lets add a delete button and an edit button
+import {emitter} from '../../lib/global';
+export type TemplatePreviewInterface = {
+        link:{
+            type:String,
+            optional: true
+        },
+        template_uuid:{
+            type: String,
+            optional: true
+        },
+        body:{
+            type: String
+        },
+        category:{
+            type: String
+        },
+        subcategory:{
+            type: String
+        },
+        language:{
+            type: String
+        },
+        subject:{
+            type: String,
+        },
+        templateType:{
+            type: String
+        },
+        enabled:{
+            type: String
+        },
+        description: {
+            type: String
+        },
+    
+}
+
+export default {
+    name:'TemplatePreview',
+    props:{
+        link:{
+            type:String,
+            optional: true
+        },
+        template_uuid:{
+            type: String,
+            optional: true
+        },
+        body:{
+            type: String
+        },
+        category:{
+            type: String
+        },
+        subcategory:{
+            type: String
+        },
+        language:{
+            type: String
+        },
+        subject:{
+            type: String,
+        },
+        templateType:{
+            type: String
+        },
+        enabled:{
+            type: String
+        },
+        description: {
+            type: String
+        },
+    },
+    methods:{
+        menuLinkClickHandler(){
+            console.log(this.description)
+            emitter.emit("template-change",this.props)
+        },
+        deleteTemplateRequest(){
+            emitter.emit("delete-template-request",{template_uuid: this.template_uuid})
+        }
+    },
+    mounted(){
+        console.log(this.link);
+    },
+    //mounted click event emitter
+}
+
+</script>
+<template>
+        <tr>
+            <th scope='col' >{{this.category }}</th>
+            <th scope='col' >
+                {{this.description }}
+            </th>
+            <th scope="col">
+                <router-link :to="this.link" class="template-preview-link" v-bind="this.props" @click="menuLinkClickHandler">
+                    Edit Template
+                </router-link>    
+            </th>
+            <td scope="col" class="align-middle text-center" >
+                <div class="btn-danger p-2 rounded align-middle text-center" @click="deleteTemplateRequest">
+                    <span>Delete</span>
+                </div>
+            </td>
+        </tr>
+    
+</template>
+
+<style scoped>
+</style>
\ No newline at end of file
diff --git a/frontend/components/TemplatesForm/TemplatesForm.vue b/frontend/components/TemplatesForm/TemplatesForm.vue
new file mode 100644
index 0000000..8c742f8
--- /dev/null
+++ b/frontend/components/TemplatesForm/TemplatesForm.vue
@@ -0,0 +1,151 @@
+<script lang="ts">
+import { emitter } from '../../lib/global';
+
+export default {
+    name: 'TemplatesForm',
+    props:{
+        template_uuid:{
+            type: String,
+            optional: true
+        },
+        body:{
+            type: String
+        },
+        category:{
+            type: String
+        },
+        subcategory:{
+            type: String
+        },
+        language:{
+            type: String
+        },
+        subject:{
+            type: String,
+        },
+        templateType:{
+            type: String
+        },
+        enabled:{
+            type: String
+        },
+        description: {
+            type: String
+        },
+    },
+    emits: {
+        'leave-menu': String
+    },
+    methods: {
+        backArrowClickHandler() {
+            emitter.emit('menu-change');
+        },
+        requestTemplateSave(event){
+            event.preventDefault();
+            //console.log(this.formInputs)
+
+            emitter.emit('edit-template',this.formInputs)
+        }
+    },
+    data(){
+        return {
+            formInputs:{
+                template_uuid:this.$route.query.email_template_uuid,
+                language: this.$route.query.template_language,
+                category:this.$route.query.template_category,
+                subcategory:this.$route.query.template_subcategory,
+                subject:this.$route.query.template_subject,
+                body:this.$route.query.template_body,
+                templateType:this.$route.query.template_templateType,
+                enabled:this.$route.query.template_enabled,
+                description:this.$route.query.template_description,
+            }
+        }
+    },
+    created(){
+
+    },
+    
+
+
+}
+</script>
+<template>
+    <div id="TEMPLATES_MENU">
+        <div class="templates-container">
+            <div class="thread-header new-message-header">
+                <div class="thread-header-container  d-flex justify-content-between align-items-center">
+                    <div class="'ml-05">
+                        <router-link class="fa fa-arrow-left btn btn-large " :to="`/templates.php`"
+                            @click="backArrowClickHandler" aria="Go Back to Templates Menu"></router-link>
+
+                        <div class="new-message-headline">
+                            <h6>Templates</h6>
+                        </div>
+
+                    </div>
+                </div>
+            </div>
+            <!-- This is where the list of templates should load -->
+            <!-- That means we need a TemplateEntry component w/ a link to edit -->
+
+            <!-- template-form should probably be a component as well -->
+            <!-- for now we need to make sure the app -> db connection works so we'll hard code -->
+
+            <div class="template-form ">
+                <div class="mt-form-row">
+                    <div class="category-template-uuid">Template UUID</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.template_uuid"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc">Language</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.language"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc mandatory">Category</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.category"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc">Subcategory</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.subcategory"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc">Subject</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.subject"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc mandatory">Body</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.body"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc">Type</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.templateType"></textarea></div>
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc">Enabled</div>
+                    <input type="checkbox" id="ENABLED_CHECKBOX" v-model="formInputs.enabled" />
+                    <label for="ENABLED_CHECKBOX">{{ formInputs.enabled }}</label> 
+
+                </div>
+                <div class="mt-form-row">
+                    <div class="category-desc">Description</div>
+                    <div class="area-for-text"> <textarea v-model="formInputs.description"></textarea></div>
+                </div>
+                <button class="submit" @click="requestTemplateSave">Submit</button>
+
+            </div>
+ 
+        </div>
+    </div>
+</template>
+
+<style scoped>
+
+</style>
\ No newline at end of file
diff --git a/frontend/components/TemplatesMenu/TemplatesMenu.vue b/frontend/components/TemplatesMenu/TemplatesMenu.vue
index 2fedfa3..2fe4643 100644
--- a/frontend/components/TemplatesMenu/TemplatesMenu.vue
+++ b/frontend/components/TemplatesMenu/TemplatesMenu.vue
@@ -1,16 +1,68 @@
 <script lang="ts">
-import {emitter} from '../../lib/global';
-
+import { emitter } from '../../lib/global';
+import { loadTemplateResponse } from '../../lib/loadTemplates';
+import TemplatePreview, { TemplatePreviewInterface } from '../TemplatePreview/TemplatePreview.vue';
 export default {
+  components: { TemplatePreview },
     name: 'TemplatesMenu',
-    emits:{
-        'leave-menu':String
+    emits: {
+        'leave-menu': String
     },
-    methods:{
+    methods: {
         backArrowClickHandler() {
             emitter.emit('menu-change');
+        },
+        requestTemplateSave(event){
+            event.preventDefault();
+            //console.log(this.formInputs)
+
+            emitter.emit('edit-template',this.formInputs)
+        },
+        buildTemplatePreview(values: loadTemplateResponse){
+            console.log(values);
+            let tempPreview:TemplatePreviewInterface = {
+                link: '/manage_templates.php?'+ new URLSearchParams(values).toString(),
+                template_uuid : values.email_template_uuid,
+                body : values.template_body,
+                category : values.template_category,
+                subcategory : values.template_subcategory,
+                language : values.template_language,
+                subject : values.template_subject,
+                templateType : values.template_type,
+                enabled : values.template_enabled,
+                description : values.template_description,
+            }
+            console.log(tempPreview)
+                
+            return tempPreview
         }
-    }
+    },
+    data(){
+        return {
+            templatesLoaded: false,
+            templatePreviews: [],
+        }
+    },
+    mounted() {
+        emitter.emit("load-templates",{});
+        emitter.on("backfill-template-complete",(results:Array<loadTemplateResponse>) =>{
+            console.log("backfilled templates");
+            console.log(results);
+            let typedTemplatesArray= new Array<TemplatePreviewInterface>;
+            for( let x = 0 ; x < results.length ; x++){
+                console.log(results[x]);
+                let entry: TemplatePreviewInterface = this.buildTemplatePreview(results[x]);
+                
+                console.log(entry);
+                typedTemplatesArray.push(entry);
+            }
+            this.templatesLoaded = true;
+            this.templatePreviews = typedTemplatesArray;
+        });
+        
+    },
+    
+
 
 }
 </script>
@@ -20,10 +72,9 @@ export default {
             <div class="thread-header new-message-header">
                 <div class="thread-header-container  d-flex justify-content-between align-items-center">
                     <div class="'ml-05">
-                        <router-link class="fa fa-arrow-left btn btn-large "
-                            :to="`/menu.php`" @click="backArrowClickHandler"
-                            aria="Go Back to Settings Menu"></router-link>
-                    
+                        <router-link class="fa fa-arrow-left btn btn-large " :to="`/menu.php`"
+                            @click="backArrowClickHandler" aria="Go Back to Settings Menu"></router-link>
+
                         <div class="new-message-headline">
                             <h6>Templates</h6>
                         </div>
@@ -31,12 +82,70 @@ export default {
                     </div>
                 </div>
             </div>
+            <!-- This is where the list of templates should load -->
+            <!-- That means we need a TemplateEntry component w/ a link to edit -->
+
+            <!-- template-form should probably be a component as well -->
+            <!-- for now we need to make sure the app -> db connection works so we'll hard code -->
+
+            <div class="templates-list overflow-scroll">
+                <router-link to="/manage_templates.php">Add New Template</router-link>
+                <div class="conditional_container table-responsive overflow-scroll" v-if="this.templatesLoaded" ref="conditional_container" >
+                    <table class="table table-striped">
+                        <thead>
+                            <tr>
+                                <th scope='col'>Type</th>
+                                <th scope='col'>Description</th>
+                                <th scope='col'>Edit Template</th>
+                                <th scope='col'>Delete Template</th>
+                            </tr>
+                        </thead> 
+                        <tbody class="overflow-scroll">
+                            <TemplatePreview  v-for="item in this.templatePreviews" :key="item.template_uuid" v-bind="item"></TemplatePreview>
+                        </tbody>
+                    </table>
+                </div>
+                <div class="load-animation-container" v-else>
+                    <img src="../../../loading-spinner.svg" alt="loading animation" width="150" height="150"/>
+                </div>
+            </div>
+
+            
+ 
         </div>
     </div>
 </template>
 
 <style scoped>
+#TEMPLATES_MENU{
+    height:85vh;
+    overflow-y: scroll;
+}
+.template-form{
+    width: 90%;
+    margin: auto;
+    align-content: center ;
+    justify-content: center;
+}
+.mt-form-row {
+    display: grid;
+    grid-template-columns: 20% 80%;
+}
+.area-for-text{
+    grid-column: 2;
+}
+.category-desc{
+    grid-column:1;
+    margin-left: 0px;
+}
+.mandatory{
+    font-weight: bolder;
+}
+
 @media screen and (width <=700px) {
+    .template-form{
+        width:95%;
+    }
     #THREAD {
         z-index: 5;
         grid-column-start: 1;
diff --git a/frontend/components/ThreadList/ThreadList.vue b/frontend/components/ThreadList/ThreadList.vue
index 8832034..39fc178 100644
--- a/frontend/components/ThreadList/ThreadList.vue
+++ b/frontend/components/ThreadList/ThreadList.vue
@@ -182,7 +182,7 @@ export default {
         </div>
         <div class="link-container-container">
             <div class="link-container">
-                <router-link :to="'/createthread.php'" class="thread-link dot-center dot bgc-none" aria-label="new contact" @click="dumpSelectedThread()">＋</router-link>
+                <router-link :to="'/createthread.php'" class="thread-link dot-center dot bgc-none fa fa-plus" aria-label="new contact" @click="dumpSelectedThread()"></router-link>
             </div>
         </div>
         
diff --git a/frontend/components/ThreadPreview/ThreadPreview.vue b/frontend/components/ThreadPreview/ThreadPreview.vue
index bd101db..ad7e0d8 100644
--- a/frontend/components/ThreadPreview/ThreadPreview.vue
+++ b/frontend/components/ThreadPreview/ThreadPreview.vue
@@ -32,11 +32,11 @@ export type ThreadPreviewInterface = {
         type: Array<String>,
     },
     threadUUID:{
-            type:String
-        },
-        unreads:{
-            type:number
-        },
+        type:String
+    },
+    unreads:{
+        type:number
+    },
 }
 
 
@@ -90,7 +90,7 @@ export default {
     components: { Conversation },
     data() {
         return{
-            newMessages:this.$props.newMessages
+            newMessagesData:this.$props.newMessages
         }
     },
     computed: {
@@ -137,12 +137,12 @@ export default {
             payload.editLink = this.contactEditLink;
             //console.log(payload);
             console.log(payload.key)
-            this.newMessages=0;
+            this.newMessagesData=0;
             emitter.emit("thread-change",payload)
         },
         newMessageHandler(){
             if(this.currentThread=='activeThread'){
-                this.newMessages = 0;
+                this.newMessagesData = 0;
             }
         }
     },
@@ -157,14 +157,14 @@ export default {
 
                 if( message.cpim.headers["group-uuid"]){
                     if(message.direction =='incoming' && this.groupUUID == message.cpim.headers["group-uuid"] ){
-                        this.newMessages++;
+                        this.newMessagesData++;
                     }
                 }
                 else{
                     console.log(this.remoteNumber, " ", message.from)
 
                     if(message.direction=='incoming' && this.remoteNumber == message.from){
-                        this.newMessages++;
+                        this.newMessagesData++;
                     }
                 }
             }
@@ -172,8 +172,8 @@ export default {
                 if(message.direction == 'incoming' && message.from == this.remoteNumber ){
                     console.log(this.remoteNumber, " ", message.from)
                     if(this.currentThread != 'activeThread'){
-                        this.newMessages++;
-                        console.log(this.newMessages);
+                        this.newMessagesData++;
+                        console.log(this.newMessagesData);
                     }
                 }
             }                
@@ -268,13 +268,7 @@ export default {
     color: white;
 }
 
-.text-center {
-    margin: 0;
-    position: relative;
-    top: 50%;
-    -ms-transform: translateY(-50%);
-    transform: translateY(-50%);
-}
+
 
 .activeThread {
     color: white;
diff --git a/frontend/components/WebTextingContainer/WebTextingContainer.vue b/frontend/components/WebTextingContainer/WebTextingContainer.vue
index d1a9eb5..db6afec 100644
--- a/frontend/components/WebTextingContainer/WebTextingContainer.vue
+++ b/frontend/components/WebTextingContainer/WebTextingContainer.vue
@@ -5,9 +5,14 @@ import { ThreadPreviewInterface } from '../ThreadPreview/ThreadPreview.vue';
 import moment from 'moment';
 import NewMessage from '../NewMessage.vue';
 import { RouterView } from 'vue-router';
+import {saveTemplate, saveTemplateQuery} from '../../lib/saveTemplates';
 import {useMatchMedia} from '../../lib/matchMedia';
 import { emitter, MessageData, ThreadChangePayload,state} from '../../lib/global';
 import {searchPreviews,loadPreviews} from '../../lib/backfillPreviews';
+import {loadTemplates, loadTemplateQuery} from '../../lib/loadTemplates';
+import { deleteTemplateQuery,deleteTemplate} from '../../lib/deleteTemplate';
+import {registerForwardAddress, registerForwardingRequest } from '../../lib/messageForwarding';
+
 
 //this component kind of functions as a partial state controller for the app
 export default {
@@ -225,8 +230,32 @@ export default {
         });
         emitter.on("backfill-previews-requested",() => {
             loadPreviews(this.extensionUUID,state.oldestMessage);
-        })
-        
+        });
+        emitter.on("add-template", async (queryString: saveTemplateQuery) =>{
+            //console.log(queryString)
+            if(queryString.template_uuid){
+                queryString.template_uuid = null;
+            }
+            queryString.extension_uuid = this.extensionUUID;
+            await saveTemplate(queryString);
+        });
+        emitter.on("edit-template", async (queryString: saveTemplateQuery) =>{
+            //console.log(queryString);
+            queryString.extension_uuid = this.extensionUUID;
+            await saveTemplate(queryString);
+        });
+        emitter.on("load-templates", async (queryString:loadTemplateQuery) =>{
+            queryString.extension_uuid = this.extensionUUID;
+            await loadTemplates(queryString);
+        });
+        emitter.on("delete-template-request", async (args: deleteTemplateQuery) =>{
+            args.extension_uuid = this.extensionUUID;
+            await deleteTemplate(args);
+        });
+        emitter.on("register-email-forwarding", async (args: registerForwardingRequest) =>{
+            args.extension_uuid = this.extensionUUID;
+            await registerForwardAddress(args)
+        });
     },
 
 }
diff --git a/frontend/components/conversation/Conversation.vue b/frontend/components/conversation/Conversation.vue
index 0b48766..f2dec7b 100644
--- a/frontend/components/conversation/Conversation.vue
+++ b/frontend/components/conversation/Conversation.vue
@@ -423,7 +423,7 @@ export default {
     color: white;
 }
 
-td:active {
+/* td:active {
     background-color: #3178B1;
     color: white;
 }
@@ -431,7 +431,7 @@ td:active {
 td:hover {
     background-color: aliceblue;
 }
-
+*/
 table {
     width: 100%;
     table-layout: fixed;
@@ -442,16 +442,13 @@ table {
     font-size: 8pt;
     padding-left: 0.5em;
 }
-
+/*
 td {
     border: solid #3178b1;
     border-radius: 1em;
 }
+*/
 
-table {
-    width: 100%;
-    table-layout: fixed;
-}
 
 .thread-container {
     border: solid #5f9fd3 2px;
diff --git a/frontend/lib/deleteTemplate.ts b/frontend/lib/deleteTemplate.ts
new file mode 100644
index 0000000..cb0b366
--- /dev/null
+++ b/frontend/lib/deleteTemplate.ts
@@ -0,0 +1,55 @@
+import { emitter } from './global';
+
+export type deleteTemplateQuery = {
+    template_uuid: String,
+    extension_uuid?:String
+}
+let temp;
+let fetching = false;
+
+
+export async function deleteTemplate(args:deleteTemplateQuery) {
+    console.log("deleting template");
+    if (fetching) {
+        console.log("skipping duplicate delete request");
+        return;
+    }
+    fetching = true;
+    emitter.emit("delete-template-pending");
+    try {
+        // console.log(args);
+        if(args){
+            console.log(args);
+            let params: deleteTemplateQuery;
+            if (args.template_uuid) {
+              params = { template_uuid: args.template_uuid };
+            }
+            if(args.extension_uuid){
+                params.extension_uuid = args.extension_uuid;
+            }
+            const initialResponse =  await fetch('/app/webtexting/deletetemplate.php?' + new URLSearchParams(params).toString()).then(r => r.json());
+            temp = initialResponse;
+            console.log(temp);
+    
+            fetching = false;
+            //console.log('backfillPreviews request complete');
+    
+            // if (initialResponse.length == 0) {
+            //     emitter.emit('no-previews-found');
+            // }
+            
+        }
+        
+
+    } catch (e) {
+        fetching = false;
+        console.log('delete template error:', e);
+    }finally{
+        
+        emitter.emit('delete-template-complete',temp);
+        fetching= false;
+        console.log(temp)
+        return  ( temp);
+    }
+
+}
\ No newline at end of file
diff --git a/frontend/lib/loadTemplates.ts b/frontend/lib/loadTemplates.ts
new file mode 100644
index 0000000..2308ab5
--- /dev/null
+++ b/frontend/lib/loadTemplates.ts
@@ -0,0 +1,71 @@
+import { emitter } from './global';
+
+export type loadTemplateQuery = {
+    extension_uuid: String
+    older_than?: String
+}
+
+export type loadTemplateResponse = {
+    domain_uuid: String;
+    email_template_uuid: String;
+    template_body: String;
+    template_category: String;
+    template_subcategory: String;
+    template_language: String;
+    template_subject: String;
+    template_type: String;
+    template_enabled: String;
+    template_description: String;
+    insert_date: String;
+    insert_user: String;
+    update_date: String;
+    update_user: String;
+};
+
+let temp;
+let fetching = false;
+export async function loadTemplates(args:loadTemplateQuery) {
+    console.log("loading template Previews");
+    if (fetching) {
+        console.log("skipping duplicate load request");
+        return;
+    }
+    fetching = true;
+    emitter.emit("template-previews-loading");
+    try {
+        // console.log(args);
+        if(args){
+            console.log(args);
+            let params: loadTemplateQuery;
+            if (args.extension_uuid) {
+              params = { extension_uuid: args.extension_uuid };
+            }
+            if (args.older_than) {
+              params.older_than = args.older_than;
+            }
+            const initialResponse =  await fetch('/app/webtexting/loadtemplates.php?' + new URLSearchParams(params).toString()).then(r => r.json());
+            temp = initialResponse;
+            console.log(temp);
+    
+            fetching = false;
+            //console.log('backfillPreviews request complete');
+    
+            // if (initialResponse.length == 0) {
+            //     emitter.emit('no-previews-found');
+            // }
+            
+        }
+        
+
+    } catch (e) {
+        fetching = false;
+        console.log('load template error:', e);
+    }finally{
+        
+        emitter.emit('backfill-template-complete',temp);
+        fetching= false;
+        console.log(temp)
+        return  ( temp);
+    }
+
+}
\ No newline at end of file
diff --git a/frontend/lib/messageForwarding.ts b/frontend/lib/messageForwarding.ts
new file mode 100644
index 0000000..d4b32fa
--- /dev/null
+++ b/frontend/lib/messageForwarding.ts
@@ -0,0 +1,22 @@
+export type registerForwardingRequest={
+    own_number:String,
+    extension_uuid: String,
+    email_address: String
+}
+export async function registerForwardAddress(query:registerForwardingRequest){
+    let fetching = false;
+    try{
+        console.log("I'm trying" ,query);
+        fetching = true;
+        const response = await fetch('/app/webtexting/register_forwarding.php?' + new URLSearchParams(query).toString()).then(r => r.json());
+        //await fetch 
+    }
+    catch(e){
+
+    }
+    finally{
+        console.log("finally done registering")
+        fetching= false;
+    }
+    
+}
\ No newline at end of file
diff --git a/frontend/lib/saveTemplates.ts b/frontend/lib/saveTemplates.ts
new file mode 100644
index 0000000..7dc7c9a
--- /dev/null
+++ b/frontend/lib/saveTemplates.ts
@@ -0,0 +1,31 @@
+import { emitter , addPreview, QUERY_LIMIT} from './global';
+
+type saveTemplateQuery = {
+    template_uuid?: string,
+    extension_uuid: string,
+    body: string,
+    category?: string,
+    subcategory?: string,
+    language?: string,
+    subject?:string,
+    templateType?: string,
+    enabled?: string,
+    description?: string
+    
+}
+
+export async function saveTemplate(query: saveTemplateQuery){
+    try{
+        console.log("I'm trying" ,query)
+        const response = await fetch('/app/webtexting/message-templates.php?' + new URLSearchParams(query).toString()).then(r => r.json());
+
+        //await fetch 
+    }
+    catch(e){
+
+    }
+    finally{
+        console.log("finally done")
+    }
+    
+}
diff --git a/frontend/routes/index.ts b/frontend/routes/index.ts
index c8caa28..01b0518 100644
--- a/frontend/routes/index.ts
+++ b/frontend/routes/index.ts
@@ -7,6 +7,8 @@ import ConvoPlaceholderVue from '@/components/ConvoPlaceholder.vue';
 import MenuPlaceHolder from '@/components/MenuPlaceholder/MenuPlaceholder.vue';
 import MenuList from '../components/MenuList/MenuList.vue';
 import TemplatesMenu from '@/components/TemplatesMenu/TemplatesMenu.vue';
+import TemplatesForm from '@/components/TemplatesForm/TemplatesForm.vue';
+import EmailForwardMenu from '@/components/EmailForwardMenu/EmailForwardMenu.vue';
 
 export const router = createRouter({
     history: createWebHistory("/app/webtexting/"),
@@ -52,6 +54,20 @@ export const router = createRouter({
                     rightSide: TemplatesMenu,
                 }
             },
+            {
+                path:"/manage_templates.php",
+                components:{
+                    leftSide:MenuList,
+                    rightSide: TemplatesForm,
+                }
+            },
+            {
+                path:"/email_forwarding.php",
+                components:{
+                    leftSide:MenuList,
+                    rightSide:EmailForwardMenu
+                }
+            },
             
         ]
         }
diff --git a/loadtemplates.php b/loadtemplates.php
new file mode 100644
index 0000000..6b587e3
--- /dev/null
+++ b/loadtemplates.php
@@ -0,0 +1,36 @@
+<?php
+require_once __DIR__."/vendor/autoload.php";
+require_once "root.php";
+require_once "resources/require.php";
+require_once "resources/check_auth.php";
+
+header("Content-Type: application/json");
+
+foreach ($_SESSION['user']['extension'] as $ext) {
+    if ($ext['extension_uuid'] == $_GET['extension_uuid']) {
+        $extension = $ext;
+        break;
+    }
+}
+
+
+if (!$extension) {
+    http_response_code(400);
+    echo json_encode(array("error" => "invalid or unauthorized extension"));
+    die();
+}
+    $database = new database;
+
+    $sql = "SELECT * from webtexting_message_templates WHERE domain_uuid = :domain_uuid";
+         $parameters['domain_uuid'] = $domain_uuid;
+         $templates = $database->select($sql, $parameters, 'all');
+      if($templates){
+          message::add("templates loaded.");
+      } else {
+          message::add("error saving changes to template.", 'negative');
+      }
+      echo(json_encode($templates));
+      return json_encode($templates);
+//       unset($parameters);
+//         //do an edit template
+//         //$domain_uuid;
\ No newline at end of file
diff --git a/message-templates.php b/message-templates.php
new file mode 100644
index 0000000..bb11b28
--- /dev/null
+++ b/message-templates.php
@@ -0,0 +1,82 @@
+<?php
+require_once __DIR__."/vendor/autoload.php";
+require_once "root.php";
+require_once "resources/require.php";
+require_once "resources/check_auth.php";
+
+header("Content-Type: application/json");
+
+foreach ($_SESSION['user']['extension'] as $ext) {
+    if ($ext['extension_uuid'] == $_GET['extension_uuid']) {
+        $extension = $ext;
+        break;
+    }
+}
+
+
+if (!$extension) {
+    http_response_code(400);
+    echo json_encode(array("error" => "invalid or unauthorized extension"));
+    die();
+}
+if($_GET['template_uuid']){
+
+    //check if request has valid uuid
+    if($_GET['template_uuid']=='undefined'){
+
+    
+        //do an add template
+        $database = new database;
+        $sql = "INSERT INTO webtexting_message_templates (domain_uuid, template_language, template_category, template_subcategory, template_subject, template_body, template_type, template_enabled, template_description)  VALUES (:domain_uuid, :template_lang, :template_cat, :template_subcat, :template_subject, :template_body, :template_type, :template_enabled, :template_desc)";
+        $parameters['domain_uuid'] = $domain_uuid;
+        $parameters['template_lang'] = $_GET['language'];
+        $parameters['template_cat'] = $_GET['category'];
+        $parameters['template_subcat'] = $_GET['subcategory'];
+        $parameters['template_subject'] = $_GET['subject'];
+        $parameters['template_body'] = $_GET['body'];
+        $parameters['template_type'] = $_GET['templateType'];
+        $parameters['template_enabled'] = $_GET['enabled'];
+        $parameters['template_desc'] = $_GET['description'];
+        if($database->execute($sql, $parameters)) {
+            message::add("Template Added.");
+        } else {
+            message::add("Error Creating Template.", 'negative');
+        }
+        unset($parameters);
+    }
+    else{
+        //valid template_uuid = update instead of add
+        $database = new database;
+
+        $sql = "UPDATE webtexting_message_templates SET template_language = :template_lang, template_category = :template_cat, template_subcategory = :template_subcat, template_subject = :template_subject, template_body = :template_body, template_type = :template_type, template_enabled = :template_enabled, template_description = :template_desc         WHERE email_template_uuid = :template_uuid AND domain_uuid = :domain_uuid";
+            $parameters['template_uuid'] = $_GET['template_uuid'];
+            $parameters['domain_uuid'] = $domain_uuid;
+            $parameters['template_lang'] = $_GET['language'];
+            $parameters['template_cat'] = $_GET['category'];
+            $parameters['template_subcat'] = $_GET['subcategory'];
+            $parameters['template_subject'] = $_GET['subject'];
+            $parameters['template_body'] = $_GET['body'];
+            $parameters['template_type'] = $_GET['templateType'];
+            $parameters['template_enabled'] = $_GET['enabled'];
+            $parameters['template_desc'] = $_GET['description'];
+        if($database->execute($sql, $parameters)) {
+            message::add("template edited.");
+        } else {
+            message::add("error saving changes to template.", 'negative');
+        }
+        unset($parameters);
+    }
+}
+else if(!$_GET['template_uuid']){
+   
+    
+
+    
+//      
+//         //do an edit template
+//         //$domain_uuid;
+
+}
+else{
+    //invalid request
+}
diff --git a/register_forwarding.php b/register_forwarding.php
new file mode 100644
index 0000000..c01de83
--- /dev/null
+++ b/register_forwarding.php
@@ -0,0 +1,32 @@
+<?php
+require_once __DIR__."/vendor/autoload.php";
+require_once "root.php";
+require_once "resources/require.php";
+require_once "resources/check_auth.php";
+
+header("Content-Type: application/json");
+
+foreach ($_SESSION['user']['extension'] as $ext) {
+    if ($ext['extension_uuid'] == $_GET['extension_uuid']) {
+        $extension = $ext;
+        break;
+    }
+}
+
+if (!$extension) {
+    http_response_code(400);
+    echo json_encode(array("error" => "invalid or unauthorized extension"));
+    die();
+}
+
+$database = new database;
+
+// get user's number
+$sql = "SELECT phone_number FROM webtexting_destinations WHERE phone_number = :phone_number AND extension_uuid = :extension_uuid";
+$parameters['extension_uuid'] = $extension['extension_uuid'];
+$parameters['phone_number'] = $_GET['own_number'];
+
+$ownNumber = $database->select($sql, $parameters, 'all');
+unset($parameters);
+//if number found continue registration hitting the sms.callpipe api
+// else return a legible fail message
\ No newline at end of file