Use slugs instead of UUIDs

Cargo.lock

  "tera",
  "tide 0.13.0",
  "tide-tera",
- "uuid",
 ]
 
 [[package]]

Cargo.toml

 tera = "1.5.0"
 tide = "0.13.0"
 tide-tera = "0.1.1"
-uuid = { version = "0.4", features = ["serde", "v4"] }
 oslo-lib = { path = "oslo-lib" }

oslo-lib/src/fs.rs

     Ok(posts)
 }
 
-pub async fn get_one_post(post_id: String) -> Result<Post, Error> {
+pub async fn get_one_post(slug: String) -> Result<Post, Error> {
     let posts_dir = get_posts_directory_path()?;
-    let path = posts_dir.join(format!("{}.json", post_id));
+    let path = posts_dir.join(format!("{}.json", slug));
     let contents = read_post_from_disk(&path).await?;
     let post = Post::from_str(&contents)?;
 
     Ok(post)
 }
 
-pub fn delete_post(post_id: String) -> Result<(), Error> {
+pub fn delete_post(slug: String) -> Result<(), Error> {
     let posts_dir = get_posts_directory_path()?;
-    let path = posts_dir.join(format!("{}.json", post_id));
+    let path = posts_dir.join(format!("{}.json", slug));
     std::fs::remove_file(path)?;
     Ok(())
 }
 
 pub fn write_post_to_disk(post: &Post) -> Result<(), Error> {
     let mut path: PathBuf = get_posts_directory_path()?;
-    let filename = format!("{}.json", post.id);
+    let filename = format!("{}.json", post.slug);
     path = path.join(&filename);
     let mut file = File::create(&path)?;
     file.write_all(serde_json::to_string(&post)?.as_bytes())?;

oslo-lib/src/lib.rs

     app.at("/posts/new")
         .with(require_auth)
         .get(routes::new_post);
-    app.at("/posts/:id")
+    app.at("/posts/:slug")
         .get(routes::single_post)
         .post(routes::update_post)
         .delete(routes::delete_post);
-    app.at("/posts/:id/edit")
+    app.at("/posts/:slug/edit")
         .with(require_auth)
         .get(routes::edit_post);
     app.at(&login_path)

oslo-lib/src/post.rs

 
 #[derive(Debug, Serialize, Deserialize)]
 pub struct Post {
-    pub id: String,
     pub title: String,
+    pub slug: String,
     pub body: String,
     pub html: String,
     pub date: String,

oslo-lib/src/routes.rs

 use tide::convert::json;
 use tide::http::mime;
 use tide::{Redirect, Request, Response, Result, StatusCode};
-use uuid::Uuid;
 
 use std::env;
 
 
 pub async fn single_post(req: Request<State>) -> Result {
     let mut context = Context::new();
-    let post_id = req.param("id")?;
-    let post = fs::get_one_post(post_id).await?;
+    let slug = req.param("slug")?;
+    let post = fs::get_one_post(slug).await?;
     context.insert("post", &post);
     render_html_response("single.html", &context, req)
 }
 
 pub async fn edit_post(req: Request<State>) -> Result {
     let mut context = Context::new();
-    let post_id = req.param("id")?;
-    let mut post = fs::get_one_post(post_id).await?;
+    let slug = req.param("slug")?;
+    let mut post = fs::get_one_post(slug).await?;
     post.body = post.body.replace("<br>", "\n");
     post.html = post.generate_html();
     context.insert("post", &post);
 
 pub async fn create_post(mut req: Request<State>) -> Result {
     let mut post: Post = req.body_form().await?;
-    post.id = Uuid::new_v4().to_string();
     post.date = Local::now().date().naive_local().to_string();
     post.body = post.body.trim().to_owned();
     post.html = post.generate_html();
     post.save().await?;
     req.session_mut()
         .insert("flash_success", String::from("Post updated successfully"))?;
-    redirect(&format!("/posts/{}", post.id))
+    redirect(&format!("/posts/{}", post.slug))
 }
 
 pub async fn delete_post(mut req: Request<State>) -> Result {
-    let id: String = req.param("id")?;
-    fs::delete_post(id)?;
+    let slug: String = req.param("slug")?;
+    fs::delete_post(slug)?;
     req.session_mut()
         .insert("flash_success", String::from("Post deleted successfully"))?;
     render_json_response(json!({ "success": "true" }))

static/script.js

 document.querySelectorAll('[data-delete]').forEach((el) => {
   el.addEventListener('click', (e) => {
     if (confirm('Are you sure? This cannot be undone.')) {
-      let postId = e.target.dataset.delete;
-      fetch(`/posts/${postId}`, {
+      let slug = e.target.dataset.delete;
+      fetch(`/posts/${slug}`, {
         method: 'DELETE',
       }).then((r) => {
         r.json().then((data) => {

static/style.css

   resize: vertical;
 }
 
-.post:not(:last-child) {
-  margin: 3em 0;
+.post {
+  margin: 1em 0;
 }
 
 .post__heading {

templates/components.html

 {% macro post(post, type) %}
   <div class="post">
-    
+
       <div class="post__heading">
         <div class="post__title">
           <span class="post__date">:: {{ post.date }} //</span>
-          <a class="post__link" href="/posts/{{ post.id }}">
+          <a class="post__link" href="/posts/{{ post.slug }}">
             {{ post.title }}
           </a>
         </div>
         {% if logged_in %}
           <div class="post__meta">
-            <a class="post__link" href="/posts/{{ post.id }}/edit">edit</a>
-            <span class="post__link danger" data-delete="{{ post.id }}">delete</span>          
+            <a class="post__link" href="/posts/{{ post.slug }}/edit">edit</a>
+            <span class="post__link danger" data-delete="{{ post.slug }}">delete</span>
           </div>
         {% endif %}
       </div>
     <input
       type="hidden"
       name="id"
-      value="{% if post %}{{ post.id }}{% endif %}"
+      value="{% if post %}{{ post.slug }}{% endif %}"
     />
     <input
       type="hidden"
         value="{% if post %}{{ post.title }}{% endif %}"
       />
     </div>
+    <div class="form__field">
+      <label for="slug" class="form__label">Slug</label>
+      <input
+        class="form__text-field"
+        type="text"
+        name="slug"
+        required
+        value="{% if post %}{{ post.slug }}{% endif %}"
+      />
+    </div>
     <div class="form__field">
       <label for="body" class="form__label">Body</label>
       <div class="editor-helpers">

templates/edit.html

 {% block content %}
 
   <div class="posts">
-    {{ components::form(post=post, action="/posts/{{ post.id }}") }}
+    {{ components::form(post=post, action="/posts/{{ post.slug }}") }}
   </div>
 
 {% endblock %}