Merge #8267

8267: Adding gifs and screenshots for features in manual r=matklad a=MozarellaMan

For #6539

This includes most of gif or screenshot examples of most items in the "Features" header. With the exceptions of:

- **On Typing Assists** - couldn't get it to work for a demo, I'm probably missing something?
- **Structural search and replace** - looked to be already a visual example of the feature
- **Workspace symbol** - wasn't sure how best to show this, all of the examples maybe? Also wasn't sure of the best code example to show it off
- **Semantic Syntax Highlighting** - seemed obvious enough to not need a screenshot, but I could easily add this

All the gifs/pngs are hosted in this [comment](https://github.com/rust-analyzer/rust-analyzer/issues/6539#issuecomment-809574840). Please let me know if any of them aren't suitable (and why) and I'll improve it! Or if you don't like the theme/font

Co-authored-by: Ayomide Bamidele <48062697+MozarellaMan@users.noreply.github.com>

crates/ide/src/annotations.rs

@@ -19,6 +19,8 @@ use crate::{
 //
 // Provides user with annotations above items for looking up references or impl blocks
 // and running/debugging binaries.
+//
+// image::https://user-images.githubusercontent.com/48062697/113020672-b7c34f00-917a-11eb-8f6e-858735660a0e.png[]
 #[derive(Debug)]
 pub struct Annotation {
     pub range: TextRange,

crates/ide/src/expand_macro.rs

@@ -23,6 +23,8 @@ pub struct ExpandedMacro {
 //
 // | VS Code | **Rust Analyzer: Expand macro recursively**
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113020648-b3973180-917a-11eb-84a9-ecb921293dc5.gif[]
 pub(crate) fn expand_macro(db: &RootDatabase, position: FilePosition) -> Option<ExpandedMacro> {
     let sema = Semantics::new(db);
     let file = sema.parse(position.file_id);

crates/ide/src/extend_selection.rs

@@ -24,6 +24,8 @@ use crate::FileRange;
 //
 // | VS Code | kbd:[Alt+Shift+→], kbd:[Alt+Shift+←]
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113020651-b42fc800-917a-11eb-8a4f-cf1a07859fac.gif[]
 pub(crate) fn extend_selection(db: &RootDatabase, frange: FileRange) -> TextRange {
     let sema = Semantics::new(db);
     let src = sema.parse(frange.file_id);

crates/ide/src/file_structure.rs

@@ -35,6 +35,9 @@ pub enum StructureNodeKind {
 //
 // | VS Code | kbd:[Ctrl+Shift+O]
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113020654-b42fc800-917a-11eb-8388-e7dc4d92b02e.gif[]
+
 pub(crate) fn file_structure(file: &SourceFile) -> Vec<StructureNode> {
     let mut res = Vec::new();
     let mut stack = Vec::new();

crates/ide/src/goto_definition.rs

@@ -21,6 +21,8 @@ use crate::{
 //
 // | VS Code | kbd:[F12]
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113065563-025fbe00-91b1-11eb-83e4-a5a703610b23.gif[]
 pub(crate) fn goto_definition(
     db: &RootDatabase,
     position: FilePosition,

crates/ide/src/goto_implementation.rs

@@ -16,6 +16,8 @@ use crate::{display::TryToNav, FilePosition, NavigationTarget, RangeInfo};
 //
 // | VS Code | kbd:[Ctrl+F12]
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113065566-02f85480-91b1-11eb-9288-aaad8abd8841.gif[]
 pub(crate) fn goto_implementation(
     db: &RootDatabase,
     position: FilePosition,

crates/ide/src/goto_type_definition.rs

@@ -12,6 +12,8 @@ use crate::{display::TryToNav, FilePosition, NavigationTarget, RangeInfo};
 //
 // | VS Code | **Go to Type Definition*
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113020657-b560f500-917a-11eb-9007-0f809733a338.gif[]
 pub(crate) fn goto_type_definition(
     db: &RootDatabase,
     position: FilePosition,

crates/ide/src/hover.rs

@@ -82,6 +82,8 @@ pub struct HoverResult {
 //
 // Shows additional information, like type of an expression or documentation for definition when "focusing" code.
 // Focusing is usually hovering with a mouse, but can also be triggered with a shortcut.
+//
+// image::https://user-images.githubusercontent.com/48062697/113020658-b5f98b80-917a-11eb-9f88-3dbc27320c95.gif[]
 pub(crate) fn hover(
     db: &RootDatabase,
     position: FilePosition,

crates/ide/src/inlay_hints.rs

@@ -52,6 +52,8 @@ pub struct InlayHint {
 //
 // | VS Code | **Rust Analyzer: Toggle inlay hints*
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113020660-b5f98b80-917a-11eb-8d70-3be3fd558cdd.png[]
 pub(crate) fn inlay_hints(
     db: &RootDatabase,
     file_id: FileId,

crates/ide/src/join_lines.rs

@@ -19,6 +19,8 @@ use text_edit::{TextEdit, TextEditBuilder};
 //
 // | VS Code | **Rust Analyzer: Join lines**
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113020661-b6922200-917a-11eb-87c4-b75acc028f11.gif[]
 pub(crate) fn join_lines(file: &SourceFile, range: TextRange) -> TextEdit {
     let range = if range.is_empty() {
         let syntax = file.syntax();

crates/ide/src/matching_brace.rs

@@ -14,6 +14,8 @@ use syntax::{
 //
 // | VS Code | **Rust Analyzer: Find matching brace**
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113065573-04298180-91b1-11eb-8dec-d4e2a202f304.gif[]
 pub(crate) fn matching_brace(file: &SourceFile, offset: TextSize) -> Option<TextSize> {
     const BRACES: &[SyntaxKind] =
         &[T!['{'], T!['}'], T!['['], T![']'], T!['('], T![')'], T![<], T![>], T![|], T![|]];

crates/ide/src/move_item.rs

@@ -25,6 +25,8 @@ pub enum Direction {
 // | VS Code | **Rust Analyzer: Move item up**
 // | VS Code | **Rust Analyzer: Move item down**
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113065576-04298180-91b1-11eb-91ce-4505e99ed598.gif[]
 pub(crate) fn move_item(
     db: &RootDatabase,
     range: FileRange,

crates/ide/src/parent_module.rs

@@ -18,6 +18,8 @@ use crate::NavigationTarget;
 //
 // | VS Code | **Rust Analyzer: Locate parent module**
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113065580-04c21800-91b1-11eb-9a32-00086161c0bd.gif[]
 
 /// This returns `Vec` because a module may be included from several places.
 pub(crate) fn parent_module(db: &RootDatabase, position: FilePosition) -> Vec<NavigationTarget> {

crates/ide/src/references.rs

@@ -48,6 +48,8 @@ pub struct Declaration {
 //
 // | VS Code | kbd:[Shift+Alt+F12]
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113020670-b7c34f00-917a-11eb-8003-370ac5f2b3cb.gif[]
 pub(crate) fn find_all_refs(
     sema: &Semantics<RootDatabase>,
     position: FilePosition,

crates/ide/src/references/rename.rs

@@ -70,6 +70,8 @@ pub(crate) fn prepare_rename(
 //
 // | VS Code | kbd:[F2]
 // |===
+//
+// image::https://user-images.githubusercontent.com/48062697/113065582-055aae80-91b1-11eb-8ade-2b58e6d81883.gif[]
 pub(crate) fn rename(
     db: &RootDatabase,
     position: FilePosition,

crates/ide/src/runnables.rs

@@ -98,6 +98,7 @@ impl Runnable {
 //
 // | VS Code | **Rust Analyzer: Run**
 // |===
+// image::https://user-images.githubusercontent.com/48062697/113065583-055aae80-91b1-11eb-958f-d67efcaf6a2f.gif[]
 pub(crate) fn runnables(db: &RootDatabase, file_id: FileId) -> Vec<Runnable> {
     let sema = Semantics::new(db);
 

crates/ide/src/status.rs

@@ -31,6 +31,7 @@ fn macro_syntax_tree_stats(db: &RootDatabase) -> SyntaxTreeStats {
 //
 // | VS Code | **Rust Analyzer: Status**
 // |===
+// image::https://user-images.githubusercontent.com/48062697/113065584-05f34500-91b1-11eb-98cc-5c196f76be7f.gif[]
 pub(crate) fn status(db: &RootDatabase, file_id: Option<FileId>) -> String {
     let mut buf = String::new();
     format_to!(buf, "{}\n", FileTextQuery.in_db(db).entries::<FilesStats>());

crates/ide/src/syntax_tree.rs

@@ -14,6 +14,7 @@ use syntax::{
 //
 // | VS Code | **Rust Analyzer: Show Syntax Tree**
 // |===
+// image::https://user-images.githubusercontent.com/48062697/113065586-068bdb80-91b1-11eb-9507-fee67f9f45a0.gif[]
 pub(crate) fn syntax_tree(
     db: &RootDatabase,
     file_id: FileId,

crates/ide/src/typing/on_enter.rs

@@ -32,6 +32,8 @@ use text_edit::TextEdit;
 //   "when": "editorTextFocus && !suggestWidgetVisible && editorLangId == rust"
 // }
 // ----
+//
+// image::https://user-images.githubusercontent.com/48062697/113065578-04c21800-91b1-11eb-82b8-22b8c481e645.gif[]
 pub(crate) fn on_enter(db: &RootDatabase, position: FilePosition) -> Option<TextEdit> {
     let parse = db.parse(position.file_id);
     let file = parse.tree();

crates/ide/src/view_hir.rs

@@ -10,6 +10,7 @@ use syntax::{algo::find_node_at_offset, ast, AstNode};
 //
 // | VS Code | **Rust Analyzer: View Hir**
 // |===
+// image::https://user-images.githubusercontent.com/48062697/113065588-068bdb80-91b1-11eb-9a78-0b4ef1e972fb.gif[]
 pub(crate) fn view_hir(db: &RootDatabase, position: FilePosition) -> String {
     body_hir(db, position).unwrap_or_else(|| "Not inside a function body".to_string())
 }

crates/ide_assists/src/handlers/auto_import.rs

@@ -61,6 +61,8 @@ use crate::{AssistContext, AssistId, AssistKind, Assists, GroupLabel};
 // - `plain`: This setting does not impose any restrictions in imports.
 //
 // In `VS Code` the configuration for this is `rust-analyzer.assist.importPrefix`.
+//
+// image::https://user-images.githubusercontent.com/48062697/113020673-b85be580-917a-11eb-9022-59585f35d4f8.gif[]
 
 // Assist: auto_import
 //

crates/ide_completion/src/completions/postfix/format_like.rs

@@ -13,6 +13,8 @@
 //   + `logi` -> `log::info!(...)`
 //   + `logw` -> `log::warn!(...)`
 //   + `loge` -> `log::error!(...)`
+//
+// image::https://user-images.githubusercontent.com/48062697/113020656-b560f500-917a-11eb-87de-02991f61beb8.gif[]
 
 use ide_db::helpers::SnippetCap;
 use syntax::ast::{self, AstToken};

crates/ide_completion/src/lib.rs

@@ -81,6 +81,8 @@ pub use crate::{
 // And the auto import completions, enabled with the `rust-analyzer.completion.autoimport.enable` setting and the corresponding LSP client capabilities.
 // Those are the additional completion options with automatic `use` import and options from all project importable items,
 // fuzzy matched agains the completion imput.
+//
+// image::https://user-images.githubusercontent.com/48062697/113020667-b72ab880-917a-11eb-8778-716cf26a0eb3.gif[]
 
 /// Main entry point for completion. We run completion as a two-phase process.
 ///

crates/ide_db/src/apply_change.rs

@@ -101,6 +101,7 @@ impl RootDatabase {
     //
     // | VS Code | **Rust Analyzer: Memory Usage (Clears Database)**
     // |===
+    // image::https://user-images.githubusercontent.com/48062697/113065592-08559f00-91b1-11eb-8c96-64b88068ec02.gif[]
     pub fn per_query_memory_usage(&mut self) -> Vec<(String, Bytes)> {
         let mut acc: Vec<(String, Bytes)> = vec![];
         let sweep = SweepStrategy::default().discard_values().sweep_all_revisions();