Sorting arguments in GraphQL - Step-by-Step Execution

Concept Flow - Sorting arguments

Receive Query with Sorting Arguments

↓

Parse Sorting Arguments

↓

Validate Sorting Fields and Order

↓

Apply Sorting to Data Source

↓

Return Sorted Results

The flow shows how a GraphQL query with sorting arguments is processed step-by-step to return sorted data.

Execution Sample

GraphQL

query {
  books(orderBy: {field: TITLE, direction: ASC}) {
    title
    author
  }
}

This query requests books sorted by title in ascending order.

Execution Table

Step	Action	Sorting Argument Parsed	Validation Result	Data Sorted By	Output Order
1	Receive query	{field: TITLE, direction: ASC}	Pending	None	Unsorted
2	Parse sorting argument	{field: TITLE, direction: ASC}	Valid	TITLE ASC	Unsorted
3	Validate sorting fields	{field: TITLE, direction: ASC}	Valid	TITLE ASC	Unsorted
4	Apply sorting to data	{field: TITLE, direction: ASC}	Valid	TITLE ASC	Sorted by TITLE ascending
5	Return results	{field: TITLE, direction: ASC}	Valid	TITLE ASC	Sorted by TITLE ascending

💡 Sorting applied successfully; results returned in ascending order by TITLE.

Variable Tracker

Variable	Start	After Step 2	After Step 3	After Step 4	Final
sortingArgument	None	{field: TITLE, direction: ASC}	{field: TITLE, direction: ASC}	{field: TITLE, direction: ASC}	{field: TITLE, direction: ASC}
validationStatus	Not started	Pending	Valid	Valid	Valid
sortedData	Unsorted	Unsorted	Unsorted	Sorted by TITLE ASC	Sorted by TITLE ASC

Key Moments - 2 Insights

Why do we need to validate the sorting fields before applying sorting?

Validation ensures the field and direction exist and are allowed, preventing errors or unexpected results. See execution_table rows 2 and 3 where validation changes from Pending to Valid.

What happens if the sorting argument is missing or invalid?

Without valid sorting arguments, data remains unsorted or defaults apply. This is implied by the initial state in execution_table row 1 where no sorting is applied.

Visual Quiz - 3 Questions

Look at the execution_table, at which step is the sorting argument first parsed?

A Step 3

B Step 1

C Step 2

D Step 4

💡 Hint

Check the 'Sorting Argument Parsed' column to see when the argument is first recognized.

According to variable_tracker, what is the validationStatus after Step 3?

A Valid

B Pending

C Invalid

D Not started

💡 Hint

Look at the 'validationStatus' row under 'After Step 3' column.

If the direction was DESC instead of ASC, how would the 'Output Order' in execution_table row 4 change?

A Sorted by TITLE ascending

B Sorted by TITLE descending

C Unsorted

D Error

💡 Hint

Refer to the 'Data Sorted By' and 'Output Order' columns in row 4 for ASC direction and imagine DESC instead.

Concept Snapshot

GraphQL sorting arguments specify how to order results.
Syntax: orderBy: {field: FIELD_NAME, direction: ASC|DESC}
Validate fields and direction before sorting.
Apply sorting to data source.
Return sorted results in query response.

Full Transcript

This visual execution trace shows how GraphQL processes sorting arguments in a query. First, the query with sorting arguments is received. Then, the sorting arguments are parsed and validated to ensure the field and direction are correct. After validation, sorting is applied to the data source, ordering the results accordingly. Finally, the sorted results are returned to the client. Variables like sortingArgument, validationStatus, and sortedData change state step-by-step. Key moments include the importance of validation and what happens if sorting arguments are missing. The quiz tests understanding of parsing steps, validation status, and effect of changing sort direction.

Practice

1. What does the orderBy argument do in a GraphQL query?

easy

A. It sorts the returned data by a specified field and direction.

B. It filters the data to only include certain fields.

C. It limits the number of results returned.

D. It groups the data by a specific field.

Solution

1. Step 1: Understand the purpose of orderBy

   The orderBy argument is used to arrange data in a specific order based on a field.

2. Step 2: Identify sorting behavior

   It sorts data either ascending (ASC) or descending (DESC) by the chosen field.

3. Final Answer:

   It sorts the returned data by a specified field and direction. -> Option A

4. Quick Check:

   Sorting = orderBy usage [OK]

Hint: Remember: orderBy controls sorting order in queries [OK]

Common Mistakes:

• Confusing orderBy with filtering or limiting results
• Thinking orderBy groups data instead of sorting
• Assuming orderBy changes the data fields returned

2. Which of the following is the correct syntax to sort users by their name in ascending order using orderBy?

easy

A. { users(orderBy: [name, ASC]) { id name } }

B. { users(orderBy: name ASC) { id name } }

C. { users(orderBy: { name: ASC }) { id name } }

D. { users(orderBy: { ASC: name }) { id name } }

Solution

1. Step 1: Review GraphQL orderBy syntax

   The correct syntax uses an object with the field as key and direction as value inside curly braces.

2. Step 2: Match syntax to options

   { users(orderBy: { name: ASC }) { id name } } matches this pattern: { name: ASC }. Others use incorrect formats.

3. Final Answer:

   { users(orderBy: { name: ASC }) { id name } } -> Option C

4. Quick Check:

   Correct orderBy syntax = { users(orderBy: { name: ASC }) { id name } } [OK]

Hint: Use curly braces with field: direction inside orderBy [OK]

Common Mistakes:

• Using parentheses or brackets incorrectly in orderBy
• Placing direction before field name
• Omitting curly braces around orderBy argument

3. Given this GraphQL query:

{ products(orderBy: { price: DESC }) { id name price } }

What will be the order of products in the result?

medium

A. Products sorted by price from highest to lowest.

B. Products sorted by price from lowest to highest.

C. Products sorted alphabetically by name.

D. Products returned in random order.

Solution

1. Step 1: Identify sorting field and direction

   The query uses orderBy: { price: DESC }, meaning sort by price descending.

2. Step 2: Understand descending order

   Descending order means highest values come first, then lower values.

3. Final Answer:

   Products sorted by price from highest to lowest. -> Option A

4. Quick Check:

   DESC means highest to lowest [OK]

Hint: DESC means descending (high to low), ASC means ascending (low to high) [OK]

Common Mistakes:

• Confusing DESC with ascending order
• Assuming sorting is by name instead of price
• Thinking orderBy does not affect order

4. You wrote this query to sort posts by date ascending:

{ posts(orderBy: { date: ASC }) { id title date } }

But you get an error. What is the likely mistake?

medium

A. You must use sortBy instead of orderBy.

B. The orderBy argument should be a list, not an object.

C. The direction ASC is not valid in GraphQL.

D. The date field is missing from the schema.

Solution

1. Step 1: Check schema fields

   If date is not defined in the posts schema, sorting by it causes an error.

2. Step 2: Validate other options

   orderBy accepts an object, ASC is valid, and sortBy is not standard GraphQL.

3. Final Answer:

   The date field is missing from the schema. -> Option D

4. Quick Check:

   Sorting field must exist in schema [OK]

Hint: Ensure sorting field exists in schema before using orderBy [OK]

Common Mistakes:

• Using invalid direction keywords
• Confusing orderBy with other arguments
• Assuming orderBy requires a list always

5. You want to fetch a list of employees sorted first by department ascending, then by salary descending. Which orderBy argument correctly achieves this?

hard

A. { employees(orderBy: { department: ASC, salary: DESC }) { id name department salary } }

B. { employees(orderBy: [{ department: ASC }, { salary: DESC }]) { id name department salary } }

C. { employees(orderBy: [department: ASC, salary: DESC]) { id name department salary } }

D. { employees(orderBy: { salary: DESC, department: ASC }) { id name department salary } }

Solution

1. Step 1: Understand multi-level sorting syntax

   To sort by multiple fields, orderBy usually takes a list of objects, each specifying a field and direction.

2. Step 2: Match correct syntax

   { employees(orderBy: [{ department: ASC }, { salary: DESC }]) { id name department salary } } uses a list with two objects: first { department: ASC }, then { salary: DESC }, which is correct.

3. Step 3: Check other options

   { employees(orderBy: { department: ASC, salary: DESC }) { id name department salary } } uses a single object with two keys, which may not guarantee order. { employees(orderBy: [department: ASC, salary: DESC]) { id name department salary } } has invalid syntax. { employees(orderBy: { salary: DESC, department: ASC }) { id name department salary } } reverses sorting priority.

4. Final Answer:

   { employees(orderBy: [{ department: ASC }, { salary: DESC }]) { id name department salary } } -> Option B

5. Quick Check:

   Multi-field orderBy = list of objects [OK]

Hint: Use a list of objects for multi-level sorting in orderBy [OK]

Common Mistakes:

• Using a single object for multiple sort fields
• Reversing the order of sorting priorities
• Incorrect syntax for list of sorting fields